For example, say I have two thumbnails and I want them to open their respective image within the gallery. How would I modify the jQ?
<style>
#open_gallery1 { background:url("demo/logo-facybox_thumb.png") no-repeat scroll 0 0 transparent; border:6px solid #000000; display:block; height:90px; text-indent:-9999px; width:120px; }
#open_gallery2 { background:url("images/coffee_48x48_thumb.png") no-repeat scroll 0 0 transparent; border:6px solid #000000; display:block; height:90px; text-indent:-9999px; width:120px; }
.gallery a.thumb { color:#000000; float:left; font-size:14px; font-weight:bold; line-height:12px; text-decoration:none; }
.gallery a.thumb:hover { color:#FFFFFF; text-shadow:0 0 4px #000000; }
</style>
<div class="gallery">
<p><a style="cursor: pointer" id="open_gallery1" class="thumb">image</a></p>
<p><a style="cursor: pointer" id="open_gallery2" class="thumb">image</a></p>
<script>
jQuery('#open_gallery').click(function(){
jQuery.facybox({images:['demo/logo-facybox.png','images/coffee_48x48.png']})
});
</script>
</div>