2011-03-05 9 views
7

Tengo un control deslizante de contenido que gira automáticamente para que al pasar el mouse sobre él deje de girar. Mi problema es el siguiente fragmento de código aquí:Evitar que Mouseenter de Mootools se active en elementos secundarios ocultos

$$('.holder').addEvents({ 
    mouseover: function(){ 
     clearInterval(rollingon); 
    }, 
    mouseout: begin 
}); 

HTML:

<div id="fliptable"> 
    <div class="holder"> 
    <ul class="headliner" style="left: 0;"> 
     <li class="headitem"> 
      <div class="squared" style="opacity: 1;"> 
          *content* 
      </div> 
     </li> 
    </ul> 
    </div> 
</div> 

Fliptable amplía el ancho del navegador. Entonces los diferentes elementos de la lista han cambiado su opacidad a medida que avanza. Ahora mi problema es mouseover se disparará cuando estoy sobre los elementos de la lista oculta. ¿Hay alguna forma de que no pueda dispararle a los niños?

Aquí es el violín JS: http://jsfiddle.net/AjWuL/

+2

su respuesta está en el título. 'mouseenter' +' mouseleave' not 'mouseover' +' mouseout' - estos son los eventos ajustados que evitan que el burbujeo salga en mouse por error si el elemento es hijo del titular del evento. si ya lo has intentado, utiliza www.jsfiddle.net para crear un ejemplo y explica tu comportamiento deseado y obtendrás ayuda :) –

+0

Oh, vaya, olvidé cambiar el código. Estaba intentando mouseover, pero al principio estaba usando mouseenter. Aquí está el jsfiddle http://jsfiddle.net/AjWuL/ –

+0

que puede haber bebido un poco esta noche, pero esto funciona según lo previsto. el deslizamiento se detiene en el mouseenter y no se reanuda por error mientras mueve el mouse dentro de cualquier elemento secundario de los .holders. Aquí hay una versión mejorada de su clase con Eventos agregados que disparan varios avances y pausas de ciclo. http://jsfiddle.net/dimitar/AjWuL/2/ - prolly no es mi mejor código pero es una mejora. note que agrego los eventos al padre el como this.parent y no a los nodos de desplazamiento (singular vs nnn eventos) –

Respuesta

1

sí, sólo se puede añadir otra clase a los elementos de la lista que no desea reaccionar a la par y hacer algo como esto

window.onmouseover=function(e){ 
if(e.target.className!="hiddenelements"){ 
what you want 
} 

que tiene que adaptar esto a su código, no sé cómo poner esto en su clase en jsfiddle.

Cuestiones relacionadas