PFK
PFK

Reputation: 116

colorbox, show the gallery from arrays link

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

Answers (1)

Jack
Jack

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

Related Questions