Hello! I am trying to get my fancybox to display separate galleries but it's looping through all of them. I have tried inserting several script snippets, creating a class and using the rel tag to group these images, to no avail, not sure if applying an additional JS script will do it or if this can be accomplished purely HTML. Any help you can give would be greatly appreciated! Here is a sample:
<li id="gallery3">
<div class="container_12">
<div class="grid_9 pad1">
<div class="wrapper">
<div class="decor"></div>
<div class="pad2">
<div class="grid_8 alpha">
<h2>Covers</h2>
<hr class="line2">
<div class="outside">
<div class="scroll">
<div>
<ul class="list4">
<li><figure><a rel="covers" href="images/horse1L.jpg"><img src="images/horse1.jpg" rel="covers" alt></a></figure></li>
<li><figure><a rel="covers" href="images/horse2L.jpg"><img src="images/horse2.jpg" rel="covers" alt></a></figure></li>
<li><figure><a href="images/tree1L.jpg"><img src="images/tree1.jpg" alt></a></figure></li>
<li><figure><a href="images/tree2L.jpg"><img src="images/tree2.jpg" alt></a></figure></li>
<li><figure><a href="images/unicorn1L.jpg"><img src="images/unicorn1.jpg" alt></a></figure></li>
<li><figure><a href="images/unicorn2L.jpg"><img src="images/unicorn2.jpg" alt></a></figure></li>
<li><figure><a href="images/flower1L.jpg"><img src="images/flower1.jpg" alt></a></figure></li>
<li class="last"><figure><a href="images/flower2L.jpg"><img src="images/flower2.jpg" alt></a></figure></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>