Advanced Gallery Configuration

[foosbot]

How do I link to different images within the same gallery?

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>