PDA

View Full Version : jquery preloader



wwfc
12-28-2011, 03:13 PM
hi - just wondering if anyone knows of a solid preloader script that can load up "all" images within a page before actually displaying the page itself?

i have tried this (http://www.gayadesign.com/diy/queryloader2-preload-your-images-with-ease/) one - and although it is pretty much spot on for my needs - it only seems to work properly in safari, chrome it seems to be 50-50 - and in firefox it simply shows the overlay, races across to 100% fades and the images are still loading.

everything that i seem to be able to find is either outdated, doesn't work or is for individual images on the page - not one preloader that loads all images before proceeding.

has anyone managed to get the gayadesign (http://www.gayadesign.com/diy/queryloader2-preload-your-images-with-ease/) preloader working on all platforms? if so, any chance of sharing the way that you did it? or if anyone has a better method in their "bag'o'tricks" could you share it with me please?

any help or suggestions will be a blessing :cool:

djr33
12-28-2011, 10:57 PM
I'm not sure why you're specifying "jquery" here. Javascript is the language, and jQuery is just a set of predefined (easy to use) functions for it. There's no reason you can't mix "real" Javascript and jQuery on the same page.

On this site, there are two preloader scripts. Do these work?
http://www.dynamicdrive.com/dynamicindex4/preloadimage.htm
http://www.dynamicdrive.com/dynamicindex4/preloadimage2.htm

Maybe someone will have a personal recommendation, but there must be hundreds (thousands?) of preloader scripts out there. Just do a search and see what comes up. The highest results will be most popular so they'll probably work well.

Something like "javascript preload all images" should get you started.

If you have a more specific question, feel free to post here again, but at the moment I think you just need to keep looking rather than trying to fix anything in particular.

Another way to do this would be to not focus on images, but instead display a "loading" graphic on top of the page until the entire page (text, images, and the rest) has loaded entirely. I believe you can check that in JS.

On the other hand, this can also be annoying-- images take time to load, but why make the user wait to see the page? Think about that a bit before doing it, or you might lose some visitors who get bored waiting.