is this the most efficient javascript rollover script?

[MWpro]

I found this guy's script, after searching for a more simple javascript rollover script. It comes from a guy on the internet named Jehiah Czebotar. Just want to see what you guys think. It also preloads the images without extra effort.

In the head:

<script type="text/javascript">
function SimpleSwap(el,which){
el.src=el.getAttribute(which ¦¦ "origsrc");
}
function SimpleSwapSetup(){
var x = document.getElementsByTagName("img");
for (var i=0;i<x.length;i++){
var oversrc = x[i].getAttribute("oversrc");
if (!oversrc) continue;

// preload image
// comment the next two lines to disable image pre-loading
x[i].oversrc_img = new Image();
x[i].oversrc_img.src=oversrc;
// set event handlers
x[i].onmouseover = new Function("SimpleSwap(this,'oversrc');");
x[i].onmouseout = new Function("SimpleSwap(this);");
// save original src
x[i].setAttribute("origsrc",x[i].src);
}
}
var PreSimpleSwapOnload =(window.onload)? window.onload : function(){};
window.onload = function(){PreSimpleSwapOnload(); SimpleSwapSetup();}
</script>

In the body:

<img src="image1.gif" oversrc="image2.gif">

[JAB Creations]

If you want to do an image rollover the smallest method would be to use a 1x1 pixel transparent gif.

XHTML

<img alt="alttext" class="rollover" src="transparent.gif" />

CSS

img.rollover {
background: url('image.gif');
}
img.rollover:hover {
background: url('image-hover.gif');
}

Because IE does not support :hover (IE7 will) you'll want to do this....

XHTML

<img alt="alttext" class="rollover" onmouseover="this.className='rolloverh'" onmouseout="this.className='rollover'" src="transparent.gif" />

CSS

img.rollover {
background: url('image.gif');
}
img.rollover:hover, img.rolloverh {
background: url('image-hover.gif');
}

Let me know how it works.

John

[zooloo]

I use this one

Head or linked file -

/* Standards Compliant Rollover Script Author : Daniel Nolan wwwdotbleedingegodotcodotuk/webdevdotphp */ function initRollovers() { if (!document.getElementById) return var aPreLoad = new Array(); var sTempSrc; var aImages = document.getElementsByTagName('img'); for (var i = 0; i < aImages.length; i++) { if (aImages[i].className == 'imgover') { var src = aImages[i].getAttribute('src'); var ftype = src.substring(src.lastIndexOf('.'), src.length); var hsrc = src.replace(ftype, '_o'+ftype); aImages[i].setAttribute('hsrc', hsrc); aPreLoad[i] = new Image(); aPreLoad[i].src = hsrc; aImages[i].onmouseover = function() { sTempSrc = this.getAttribute('src'); this.setAttribute('src', this.getAttribute('hsrc')); } aImages[i].onmouseout = function() { if (!sTempSrc) sTempSrc = this.getAttribute('src').replace('_o'+ftype, ftype); this.setAttribute('src', sTempSrc); } } } } window.onload = initRollovers;

On the page use the class imgover -

<img src="whatever.gif" class="imgover">

and the javascript substitutes whatever_o.gif

I like it

zoo