How to preload your web image?

In one of my website, when user hover his mouse on a menu image, the image is replaced by a hover menu image. This cause minor performance lag, because when the user hover his mouse, the image has to be reloaded.

There have been many ways of preloading images to prevent this lag. One elegant way of doing this is by using css. You have to add your css file :


.preloadimage { display:none; }

, and add to your html/php code:


<img src=”images/pic1.jpg” class=”preloadimage” />

1 comment(s)

Track this comments via RSS 2.0 feed. Feel free to post the comment, or trackback from your web site.

Aug 19, 2010 by neil from web design liverpool
preloading images is vital, very useful tip this as it prevents waiting for images to cache. until now id always done this using javascript, didnt know css could do it!
Any feedback from you?

Your name (required)

E-mail address (required) (not published!)

Website

Your comment

This site uses KeywordLuv. Enter YourName@YourKeywords in the Name field to take advantage.