PDA

Click to See Complete Forum and Search --> : [RESOLVED] Preload image with CSS....

Static
Jan 16th, 2006, 10:25 AM
I found this:


<style type="text/css">
.hiddenPic {display: none;}
</style>

<body>
<Img src="images/home_logo.jpg" class="hiddenPic">
</body>


as a way to preload images for the next page.. but it doesnt seem to work.
is there an easy way to do this?? (without javascript)
reason being, there is a fade transition from index to home page.. I would like to preload the images so you dont see them "popping" in as it transitions.

thanks!
CornedBee
Jan 16th, 2006, 10:47 AM
It's not possible to use CSS alone to preload images. You have to use some HTML mechanism (<object declare> should work, but doesn't in most browsers) or JavaScript.

Does the fading effect (an IE-specific filter effect, if I'm not mistaken) even work when JS is disabled?
Static
Jan 16th, 2006, 10:51 AM
Ok, so JS it is for the pre-load...

yes fade is an IE specific effect... I dont know if its dependent on JS being enabled?

<meta http-equiv="Page-Exit" content="blendTrans(Duration=3)">

might be... its not a big deal if it doesnt work... just looks "nice" ;)
Static
Jan 16th, 2006, 10:52 AM
wait.. forgot to ask for the preload code! ;)

would u mind posting it for javascript? thanks!
CornedBee
Jan 16th, 2006, 10:53 AM
http://www.google.com/search?q=preload+images&start=0&ie=utf-8&oe=utf-8&client=firefox-a&rls=org.mozilla:en-US:official
Static
Jan 16th, 2006, 10:55 AM
fine.. you might as well just call me LAZY!!;) thanks!
penagate
Jan 17th, 2006, 12:56 PM
Fade is a proprietary extension, not dependant on Javascript, and IMO an abuse of HTTP headers.