jQuery Lightbox Help

Question

Ok, I am a COMPLETE beginner, but in order to complete a website I am working on I need to create a lightbox that appears when clicked on a link.

The website I am creating is a portfolio of an artists work and I need to learn the jQuery that would mean that they can click on a photo and a div fades in with a larger version of that photo.

The smaller images are stored in a folder called "Portfolio" and the Lightbox image is stored in a folder called "lightbox".

The main problem I am having is not so much the lightbox but the image that shows up, how can I get the correct image to appear? Do I need an id in my div that corresponds to the jQuery?

Thanks for the help.

Answer 1

The image that pops up is always the one that the thumbnail is linked to. In the following case, the image.jpg file from the lightbox folder will pop up when the thumbnail is clicked.

<a href="lightbox/image.jpg" rel="lightbox">
    <img src="portfolio/image-thumb.jpg" alt="..." />
</a>

Hope this helps!