Ver Mensaje Individual
  #1 (permalink)  
Antiguo 27/05/2014, 12:04
Avatar de Italico76
Italico76
 
Fecha de Ingreso: abril-2007
Mensajes: 3.303
Antigüedad: 17 años, 7 meses
Puntos: 292
Problema para evitar apilamientos de registro de eventos

Buenas,

No encuentro la forma de evitar que se me llene la pila de registro de eventos del tipo MouseOver, he intentado remover esos eventos con MouseOut pero no lo logro

Si ven en el este script que he escrito, si se pasa muchas veces por encima del caminante este acelera su paso debido a la clonacion de la funcion moveMeHor()

Código Javascript:
Ver original
  1. <html>
  2. <head>
  3. <title>No molestar!</title>
  4. <style>
  5.     body {background-color: #000;} 
  6.    
  7.     h1 {color: white;}
  8.  
  9.    #moverDiv
  10.    {
  11.         width:350px;
  12.         height:350px;
  13.         background-image: url("http://oi54.tinypic.com/28k3pjo.jpg");
  14.         border: red 2px;
  15.         position:relative;
  16.    }
  17. </style>
  18. </head>
  19. <body>
  20. <h1> No me molestes </h1>
  21.  
  22. <div id = "moverDiv"></div>
  23.  
  24. <script>
  25.     // @author: Pablo Bozzolo
  26.    
  27.     function moveMeHor(elem,cant,smooth)
  28.     {
  29.         smooth = smooth || false;
  30.        
  31.         elem.removeEventListener('mouseover',miHandler,false);
  32.        
  33.         if (!smooth){
  34.             elem.style.left = cant;
  35.             return;
  36.         }  
  37.    
  38.         (function(){           
  39.            
  40.             i = 0;
  41.             inter = setInterval(function()
  42.             {  
  43.                 if (i>cant)
  44.                 {                  
  45.                     i=0;
  46.                 }          
  47.            
  48.                 if (i==cant)
  49.                 {
  50.                     clearInterval(inter);
  51.                     div.addEventListener ('mouseover',miHandler,false);                
  52.                 }              
  53.                 elem.style.left = i;
  54.                 i++;
  55.                
  56.             },1);
  57.         })();  
  58.        
  59.        
  60.     }
  61.    
  62.     window.onload = function()
  63.     {  
  64.         div = document.getElementById('moverDiv'); 
  65.  
  66.         miHandler = function(){moveMeHor(div,500,true);};  
  67.         miHandler2 = function(){console.log('removiendo handler1'); div.removeEventListener('mouseover',miHandler,false);};
  68.            
  69.         // espero un tiempito segundo antes de registrar el mouseover  
  70.         setInterval(function(){
  71.             div.addEventListener ('mouseover',miHandler,false);
  72.             div.addEventListener ('mouseout',miHandler2,false);
  73.         },500);
  74.     }
  75.        
  76. </script>
  77. </body>
  78. </html>

Graciass!
__________________
Salu2!

Última edición por Italico76; 27/05/2014 a las 12:15