Rollover sobre varias imágenes

[Adler]

Hola

Aunque la respuesta de @_cronos2 (¿Qué tal colega?) es correcta. En algún caso puede que el rollover no sea muy fluido. Para que sea fluido, puedes insertar todas las imágenes un una sola. Con la propiedad css background-position muestras las imágenes y con javascript cambias dicha propiedad

Código Javascript:

<style>
#img1 a img, #img2 a img, #img3 a img, ....... { 
background: url("sprite.jpg");
background-repeat: no-repeat;
}
 
#img1 a img { 
background-position: -32px -6px;
}
 
#img2 a img{
background-position: -32px -37px;
}
 
.....
</style>
 
<p id="img1"><a href="#"><img src="./pixel.gif" alt="" onmouseover="this.style.backgroundPosition = '0 -6px'" onmouseout="this.style.backgroundPosition = '-32px -6px'"/></a></p>
<p id="img2"><a href="#"><img src="./pixel.gif" alt="" onmouseover="this.style.backgroundPosition = '0 -37px'"  onmouseout="this.style.backgroundPosition = '-32px -37px'" /></a></p>
 

Suerte