<head> <script language="JavaScript" type="text/javascript"><!-- function ChangeImg() { if(document.images) { eval("document."+ChangeImg.arguments[0]+ ".src=('"+ChangeImg.arguments[1]+"')"); } }
function preload() { if (document.images) { var imgsrc = preload.arguments; arr=new Array(imgsrc.length); for (var j=0; j<imgsrc.length; j++) { arr[j] = new Image; arr[j].src = imgsrc[j]; } } } //--></script> </head>
<body onload="preload('over1.gif', 'over2.gif', 'overN.gif')">
где overN.gif - картинка, которая должна показываться при наведении мышки. onload нужен для того, чтобы картинки подгружались сразу, а не в то время, когда навели мышку, так как на слабом канале эффекта сразу можно не заметить.
<a href="1.htm" onmouseover="ChangeImg('image1','over1.gif')" onmouseout="ChangeImg('image1','out1.gif')"><img src="out1.gif" name="image1" alt="image1" /></a>
<a href="2.htm" onmouseover="ChangeImg('image2','over2.gif')" onmouseout="ChangeImg('image2','out2.gif')"><img src="out2.gif" name="image2" alt="image2" /></a>
...
<a href="N.htm" onmouseover="ChangeImg('imageN','overN.gif')" onmouseout="ChangeImg('imageN','outN.gif')"><img src="outN.gif" name="imageN" alt="imageN" /></a>
в <img> "name" нужно для того, чтобы JS знал, какой картинке соответствует каждая ссылка.
Если вы хотите, чтобы картинка менялась, но не была при этом ссылкой, смотрите пункт 5.1.