To improve website performance we need to preloaded the images which used in hover and rollover effects
Instead of using jquery or javascript to preload the images, we can do that using CSS.
The following Example show you how to preload all images
<html>
<title> preloading Images</title>
<style>
.load_images
{ display : none; }
<body>
<div class="load_images">
/* You can Load Multiple no images like this */
<img src="preloaded_image1.jpg" />
<img src="preloaded_image2.jpg" />
<img src="preloaded_image3.jpg" />
<img src="preloaded_image4.jpg" />
<img src="preloaded_image5.jpg" />
</div>
</body>
</html>
The “load_images” class will load and hide all images., So the roll over images will load smoothly.
