The task: present a series of images on a corporate intranet web site to users for viewing.
I hacked together some javascript to show the list of images with thumbnails, and each image is clickable and takes you to the large image, but then you have to hit back to go to the next image, and I'm being asked to provide some next/previous functionality. I have the skills to work up something better, but that will take time.
I'm hoping someone has a recommendation for a quick and easy way to do this: perhaps a library or a method. The current site is ASP classic but that is absolutely not required: it could be ASP.Net, or php for all I care!
The current site looks something like this:
Current Scope
- Image 1 Title [thumbnail] (link)
- Image 2 Title [thumbnail] (link)
- Image 3 Title [thumbnail] (link)
Alternate Scope 1 (link)
Alternate Scope 2 (link)
Alternate Scope 3 (link)
Clicking one of the alternate scope links collapses the old current scope and looks up and displays the images available for it, making it the new current scope.,
I'm thinking about having a strip across the top/left/bottom with thumbnails of all the current images that are in scope. When clicking on each one, it should show in the rest of the page, and then either be able to click Previous/Next or click the next desired image.
Last, to reduce page load time I'm going to make loading asynchronous by ajaxifying everything and will preload the large sizes of all the images (but stop when another scope is clicked)...
Finally, while certainly not a requirement, since some of the images are very large, it would be great to have pan & zoom tools rather than just display the image at full size or resized to fit the screen (which may be only 1024x768).
Any thoughts?
I'm not asking for anyone to build this for me, just hoping someone knows of a library or html demo page or series of javascript pieces that might have some of the functionality I'm looking for. This javascript pan & zoom example could be a good start...