Buenas gente,
Necesito realizar una función para generar una animación modificando la position background del css.
La función que he creado funciona perfectamente, pero falla un grandísimo detalle, y es que intento reutilizar esa función para varios eventos en mi html, pero al parecer javascript no ejecuta las funciones en paralelo cada vez que se hace una llamada desde un evento.
Os dejo un fragmento de código.
Código Javascript
:
Ver originalvar time=null;
//parámetros (elementoHtml,Salto que da en cada iteración, el alto total del sprite con las capas, tiempo de duracion)
function pelicula(elm,jumpPx,spriteHeight,duration){
if(time==null){
time=setInterval(action,duration);//255
}
var inc=0;
function action(){
if(inc<spriteHeight){
inc+=jumpPx;
elm.style.backgroundPosition='0px -'+inc+'px';
}else{
clearInterval(time);
elm.style.backgroundPosition='0px -0px';
time=null;
}
}
}
Código HTML:
Ver original<div id="gear" onmouseover="pelicula(this,124,992,200)"> <div id="code" onmouseover="pelicula(this,124,1116,340)">
Mi duda es, como generar varios eventos en paralelo sin que eso afecte al que esta ejecutándose (si se ha activado alguna de las animaciones con el evento).
En cuanto ejecuto la animación del div id="gear" y acto seguido quiero activar la otra animación me da problemas.
Saludos!!!