Image Rollover, I am new to JS please explain me something

[cs.punk]

Ok I understand PHP basically...

 

I just want to know if someone can explain this to me:

 

//Preload images

if (document.images) 
{login_on = new image
   login = new image
                                          //what are these 'new image' for? A varible
                                         //assigned to another one? 
   login_on.src = "images/login_on.jpg"
   login.src = "images/login.jpg"
}

function chgImg(imgField,imgState)
{document[imgField].src = "images/" + imgField + imgState + ".jpg"
}

 

Thats the script right,

 

   <a href="login.php"
   onmouseover="chgImg('login','_on')"
   onmouseout="chgImg('login','')">
   <img src="images/login.jpg" width="120" height="62" border="0"name="login" />
   </a>

 

How could I write this script so that I can call on the externel script (the first one) for all my image roll overs, not just for the login button?

 

[corbin]

You could have an array of image paths and just loop through it.

[N1CK3RS0N]

Theres a much easier way to do mouseover image changes without javascript.

 

HTML

<td class="nav_01">
<a href="#"><span class="nav-hide">Home</span></a>
</td>

 

CSS

.nav_01 a {
width: 80px;
height: 45px;
background: url(../images/nav_01.png);
background-repeat: no-repeat;
display: block;
margin: 0 auto;
}
.nav_01 a:hover {
background: url(../images/nav_over_01.png);
background-repeat: no-repeat;
}
.nav-hide {
display:none;
}