[jQuery] Navigating between multiple images on one page
Hello,
Can someone (an experienced jQuery user) help me out with this
problem:
I want to place 3 images on one page:
<img src="http://www.myurl.com/images/1.jpg />
<img src="http://www.myurl.com/images/2.jpg />
<img src="http://www.myurl.com/images/3.jpg />
And then position them on top of each other by using css positioning +
z-index.
Image 1 would be positioned above image 2, 2 above 3, ...
What I'd like to do with jQuery is this:
I'd like to provide 3 links: 1|2|3
Clicking link 1 wouldn't have any consequence.
When clicking link 2, image one would have to fade away, so that image
2 becomes visible.
The same would happen when link 3 is clicked: image 2 would fade away
so that image 3 becomes visible.
Where can I find more information (a tutorial perhaps) to accomplish
this?
I would also have to think about more complex situations:
Clicking link 3 when image 1 is shown -> image 1 ánd image two would
have to fade away, ...
Clicking link 1 when image 3 is shown -> image 1 would have to
reappear, ...
Any help woudl be very welcome.
Kind regards,
Johan Van Mol