Los eventos se heredan??

[chemajf]

Hola, tengo un problema que no entiendo, a ver:

Tengo la siguiente estructura HTML:

Código HTML:

<div class="miniaturas" onmouseover="detieneMuestra();" onmouseout="muestraCampanas();">
	<a href="#" class="no_selected">
		<img id="img1" class="imagen_min" src="" title="" alt="" />
	</a>
	<a href="#" class="no_selected" >
		<img id="img2" class="imagen_min" src="" title="" alt="" />
	</a>
</div> 

Estas dos imagenes las voy canbiando periodica mente utilizando JavaScript de la siguiente manera:

Código Javascript:

//Variables globales
var timerID = null;
var paradaTotal = false;
var cont = 0;
var tiempo = 1000;
 
// Esta función se dispara con un onload en el body
//y comienza la tarea periódica que cada "tiempo"
// realiza la función siguiente() que es la que realiza
//el cambio de imágenes (img1 y img2).
function muestraCampanas() {
    if(!paradaTotal){
        siguiente();
        timerID = setTimeout('muestraCampanas()', tiempo);
    }
}
 
//Esta función detiene esa tarea cuando nos colocamos con el ratón encima del DVI.
function detieneMuestra() {
        clearTimeout(timerID);
}
 

Esto, tal como está, funciona, el problema es que cuando paso de una imagen a otra, sin salir del DIV class="miniaturas", se ejecuta el onmouseout="muestraCampanas(); que está en el DIV, o sea, que es como si los <a> o las <img> heredaran los onmouseover y los onmouseout del DIV.

¿Como puedo impedir esto?

Gracias.

[CHuLoSoY]

Yo lo haría así:

<div class="miniaturas">
<a href="#" class="no_selected" >
<img id="img" onmouseover="detieneMuestra();" onmouseout="muestraCampanas();" class="imagen_min" src="" title="" alt="" />
</a>
</div>

Y cambiando la imagen:

document.getElementById("img").src="imagen.png";