I have an object in place to run my image slideshow that is meant to:
- Build a list of images from a hidden unordered list with links to the images
- For debugging purposes, I've attached the next image method event to clicking on the gallery (the image)
- If the image hasn't been downloaded to cache, then download the image first.
- Cross fade the image in.
- Repeat through all images.
Now if I click on the image, the background of the div flashes white as is it hasn't been downloaded yet (which to my knowledge it has). This is obviously ruining the intended effect of the cross fade.
I don't want to load all images up front to save bandwidth and make the end user's experience slightly faster.
The site is at: http://www.noosariver.com.au/whatplant/ and is still in development phase.
Why won't my images preload? They seem to be when using Firebug's Net tab, but then they seem to be downloaded again.
Should I just bite the bullet and just load all images at once, and then hide them once loaded?