El caso es que me encuentro con una página en la que aparecen varios botones con sombreado... es necesario hacerles rollover y la única opcion es crear un mapa de imagen para cada uno de ellos ( Si utilizo png´s el área activa esta rodeando todo el boton, sin estar encima de él, obteniendo un efecto muy feo! )
He conseguido un script para hacer la sustitucion de imágenes con jquery, pero aplicar esto a un mapa de imagen es lo que no consigo.
Os dejo el código:
<script src="jquery-1.3.2.js" type="text/javascript"></script> <script language="jscript" type="text/jscript">
$(document).ready(function() {
$(".roll").each(function() {
rollsrc = $(this).attr("src");
rollON = rollsrc.replace(/.jpg$/ig, "_over.jpg");
$("<img>").attr("src", rollON);
});
$(".roll").mouseover(function() {
imgsrc = $(this).attr("src");
matches = imgsrc.match(/_over/);
if (!matches) {
imgsrcON = imgsrc.replace(/.jpg$/ig, "_over.jpg");
$(this).attr("src", imgsrcON);
}
});
$(".roll").mouseout(function() {
$(this).attr("src", imgsrc);
});
});
</script>
Muchas gracias de antemano!
Saludos