I would like to be able to click on a thumbnail images which will display the larger version in a separate div. Preferably the image fades in rather than just appear. Additionally I would like a border to appear around the thumbnail when selected.
The only experience I have of javascript/jquery was from installing a lightbox2 gallery.
There are lots of prewritten jQuery scripts for this sort of thing. You can Google things like jQuery thumbnail gallery" etc. and find a lot of examples. Here are some that may or not be what you want, or at least adaptable to your need:
Thankyou for your input. The Galleriffic one looks the closest.
In my attachment I have the left hand column which contains the thumbnails and the right hand column which is currently a blank div which I hope to display the selected image.
Could Galleriffic be adapted to my current layout? I’d like to keep the layout exactly as it is.
It has a placeholder image until you click on a thumbnail. You could make that placeholder image a simple, transparent one, so that it looks like there’s nothing there, or an image the same color as the background. You can style this gallery to look just like your screen shot, too.
And here’s another jQuery gallery I meant to list:
Yes, it’s a really nice bit of code, too. And it can be laid out any way you like—just as in your screen shot. If you need any help with the layout, just let us know.
The layout and styling is actually done and exactly like the wireframe. Being a novice I had trouble to start with but it all clicked into place. Starting to enjoy piecing the puzzle together and am thinking I prefer it to working in print!
I should imagine I’ll have a few more questions soon but thanks for the input.