Colorbox JSON demo

http://stackoverflow.com/questions/10747665/colorbox-gallery-using-json

by jesus_tesh

HTML

<script src="http://www.jacklmoore.com/colorbox/colorbox/jquery.colorbox.js"></script>
<link rel="stylesheet" href="http://www.jacklmoore.com/colorbox/example1/colorbox.css">
<div id="gallery-holder"></div>

JavaScript

var links = $(), link;
var data = [
   {
      "url":"http://4.bp.blogspot.com/_e-kQd22FjHI/Ssr_syO08_I/AAAAAAAAAKE/FK4lFxsPtCg/s400/semi-detached-houses-limassol-cyprus.Camelia+House+Type+C+14.jpg",
      "name":"1420 Magnolia (1)"
   },
   {
      "url":"http://homesforsaleinnorthwestarkansas.com/wp-content/uploads/2011/09/house.jpg",
      "name":"1420 Magnolia (10)"
   },
   {
      "url":"http://iccaustin.coop/images/houses-arrakis.jpg",
      "name":"1420 Magnolia (11)"
   }
];

$.each(data, function(index, photo) {
    console.log('hi');
    link = $('<a/>', {
        href: photo.url,
        title: photo.name,
        text: photo.name
    });

    links = links.add(link);
});

links.colorbox({rel:'gallery', speed:0});

$("#gallery-holder").append(links);