Using an Image Preloader Script in your Joomla Template

If your website is created with Joomla and you prefer to use mouseover images for your navigation it may take some time to load the image when you put your mouse over it. This wont make you happy certainly. In this regard, if you wish to prevent this lag time for loading image in your navigation, an Image Preloader Script can be the solution. Let’s see how you can do it.

Add the following Javascript snippet just above your closing head tag:

<html>
<head>
<script type=”text/javascript”>
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf(“#”)!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
</script>
</head>

Then add the full url’s of the images you want to preload in the body tag.

In this way, you can easily reduce the time of loading your mouseover image.

2 Comments
  1. October 3, 2011
  2. October 3, 2011

Leave a Reply

Your email address will not be published. Required fields are marked *