Hola a todos, tengo una función que me cambia la imagen al pasar por encima, sustituyendola por otra de la siguiente manera:
Código PHP:
$(".event-button").hover(function() {
pos=$(this).attr("src").lastIndexOf("-");
valor=$(this).attr("src").substr(pos+1,3);
imgName=$(this).attr("src").replace(valor,"hov");
$(this).attr("src",imgName);
},function() {
pos=$(this).attr("src").lastIndexOf("-");
valor=$(this).attr("src").substr(pos+1,3);
imgName=$(this).attr("src").replace(valor,"out");
$(this).attr("src",imgName);
});
Código PHP:
<img class="event-button" src="imagen-out.png" alt="" /></a>
Hasta ahí todo correcto, pero si dentro de la imagen introduzco un texto dentro de un SPAN:
Código PHP:
<img class="event-button" src="imagen-out.png" alt="" /><span>texto</span</a>
Lo que sucede entonces que aunque estés dentro de la imagen, al pasar por encima del SPAN, la imagen vuelve a cambiar activandose la de OUT y lo que quiero es que se mantenga la imagen del HOVER.
No manejo todavía muy bien el jquery, y quería saber si hay alguna manera de que el hover afecte también a todas las etiquetas hijas de la que se ha indicado.
Un saludo.