Question

I need to add a way for users to cycle through a gallery with arrows. I already have the script set up to use thumbnails with links to display larger images in a photo area.

The method I’m using to make the arrows work is to get the src of the current image, and search the thumbnail links for that src, and then find either the next or previous src based on which arrow was clicked (.left or .right).

Here’s the issue: I don’t know how to do this. I’ve got the script to find the current src when a user clicks on an arrow, but I can’t figure out how to search the thumbnails for the same src or find the next or previous src.

http://jsfiddle.net/G5VAf/

Answer 1

You can use $('img[src="'+current+'"]') to get any images that have the same source. Presumably you want to use something like $('#thumbnails img[src=...]') or $('img.thumb[src=...]') to limit yourself to just the thumbnails.

Getting the next or previous image is a simple matter of using .next() and .prev().