Tengo una secuencia de animación compleja que involucra desvanecimientos y transiciones en JavaScript. Durante esta secuencia, que consta de cuatro elementos que cambian a la vez, unsetTimeout se usa en cada elemento.

Probada en Internet Explorer 9, la animación funciona a velocidad en tiempo real (debería llevar 1,6 segundos y exactamente 1,6 segundos). CUALQUIER otro navegador se retrasará horriblemente, con tiempos de animación de 4 segundos (Firefox 3 y 4, Chrome, Opera) y algo así como 20 segundos en IE 8 y menos.

¿Cómo puede IE9 ir tan rápido mientras todos los demás navegadores están atrapados en el barro?

Intenté encontrar formas de fusionar los elementos en uno, para tener un setTimeout en un momento dado, pero desafortunadamente no resistiría ninguna interferencia (como hacer clic en un enlace diferente para comenzar una nueva animación antes del inicio). el actual ha terminado).

EDITAR: Para elaborar en respuesta a los comentarios, aquí está el resumen del código:

link.onclick = function() {
    clearTimeout(colourFadeTimeout);
    colourFadeTimeout = setTimeout("colourFade(0);",25);

    clearTimeout(arrowScrollTimeout);
    arrowScrollTimeout = setTimeout("arrowScroll(0);",25);

    clearTimeout(pageFadeOutTimeout);
    pageFadeOutTimeout = setTimeout("pageFadeOut(0);",25);

    clearTimeout(pageFadeInTimeout);
    pageFadeInTimeout = setTimeout("pageFadeIn(0);",25);
}

Cada una de las cuatro funciones progresa el desvanecimiento en un cuadro, luego establece otro tiempo de espera con el argumento incrementado, hasta el final de la animación.

Puedes ver la página enhttp://adamhaskell.net/cw/index.html (Nombre de usuario: knockknock; Contraseña: goaway) (tiene sonido y música, que se pueden deshabilitar, ¡pero ten cuidado!): Mi JavaScript es muy desordenado ya que no lo he organizado correctamente, pero espero que lo comente un poco Puedes ver cuál es la idea general.