I'm using Lightbox2 in a fairly standard implementation: click on an image in a series (all with rel="lightbox[gallery]") and it opens in the Lighbox with the next/prev arrows pointing to the next and previous image in the series. I also have a text link that points to the first image and opens the gallery (also with rel="lightbox[gallery]").
The problem is that, for some reason, that text link is counting as an image in the series. So when the 6 image gallery loads, it claims there are 7 images (the first counting twice). What's more is that it loads on image 2 of 7, skipping the first one (which is a duplicate anyway).
If I remove that text link, all is well. But, of course, I can't. So what are my options? Can I use javascript to initiate the Lightbox (so the link doesn't count as an image in the gallery)? Anyway, code:
<script type="text/javascript" src="lightbox.js"></script>
<!-- THIS IS THE TEXT LINK. NOTE THAT IT IS IDENTICAL TO THE FIRST IMAGE LINK -->
<a href="first.jpg" title="I am image one of three" rel="lightbox[gallery]">View Gallery</a>
<!-- THESE ARE THE GALLERY IMAGES. NOTE THAT THERE ARE 6 OF THEM. WHEN GALLERY LOADS, IT WILL THINK THERE ARE 7 BECAUSE OF THE TEXT LINK ABOVE -->
<a href="first.jpg" title="I am image one of three" rel="lightbox[gallery]"><img src="first_sm.jpg"></a>
<a href="second.jpg" title="I am image two of three" rel="lightbox[gallery]"><img src="second_sm.jpg"></a>
<a href="third.jpg" title="I am image three of three" rel="lightbox[gallery]"><img src="third_sm.jpg"></a>
<a href="fourth.jpg" title="I am image four of three" rel="lightbox[gallery]"><img src="fourth_sm.jpg"></a>
<a href="fifth.jpg" title="I am image five of three" rel="lightbox[gallery]"><img src="fifth_sm.jpg"></a>
<a href="sixth.jpg" title="I am image six of three" rel="lightbox[gallery]"><img src="sixth_sm.jpg"></a>
Figured it out! I added an id to the first image:
<a id="first_img" href="first.jpg" title="I am image one of three" rel="lightbox[gallery]"><img src="first_sm.jpg"></a>
Then I change the text link to a <span> with an onClick like so:
<span onclick="$('#first_img').click();">View Gallery</span>
I styled the <span> to look and behave like a link, and voila!
(Sometimes all it takes is writing out your question to get to the answer!)