Reputation: 116
I have gallery which i want to show in jquery colorbox,
the user clicks on the link and it opens the overlay gallery.the gallery containing 1 or more images.
<a href="" id="30">
<img border="0" src="/uploads/coverGallery1.png" width="225" height="164" alt="" class="image"/>
</a>
I can only deliver the images from db as array link:
<script>
var prod_img_30 = Array( // 30: is the id of the link
Array('/uploads/image1.png',0),
Array('/uploads/image2.png',0),
Array('/uploads/image1.png',0)
);
</script>
I need to integrate the jquery colorbox to my code but till now i couldn't, any idea would be helpfull.
Upvotes: 0
Views: 1125
Reputation: 9538
ColorBox only works with elements in the DOM, so you would have to temporarily add links to your document to be able to show these as a gallery. For example:
var $gallery = $('<div>').hide().appendTo('body');
var arr = ['img1.jpg', 'img2.jpg', 'img3.jpg'];
$.each(arr, function(i){
$('<a href="'+arr[i]+'"></a>').appendTo($gallery);
});
$gallery.find('a').colorbox({rel:'mygroup', open:true});
Upvotes: 1