I’m trying to do a Fancybox image gallery. I have a function that takes a list of image URLs and appends them to the DOM like so
function handleImageURLs(imageURLs) {
var appendString = "";
//Create an <a> tag for each image URL
for(var i = imageURLs.length - 1; i >= 0; i --) {
appendString += "<a href='"+ imageURLs[i] +"' rel='img_preview'><img src='"+ imageURLs[i] +" />'</a>";
}
//Add the <a> tags containing images to the <body> element
$("body").append(appendString);
//Select the image <a> tags and call Fancybox
$("a[rel='img_preview']").fancybox({
onCleanup: function() {
//do cleanup stuff, remove images, etc.
}
});
}
Everything works fine. The <a> tags get added to the DOM. But Fancybox doesn’t open at all. And doesn’t throw any errors. Any idea what I’m doing wrong?
Used a combination of this and triggered a
clickevent on the image that I wanted to display.