Todo Javascript en el sitio funciona terriblemente lento en Firefox 4 cuando hay PNG transparentes en la página

Question 1

ACTUALIZACIÓN DE ETA: Descubrí que si elimino todos los archivos .png transparentes de mi sitio, hay alrededor de 5, funciona bien. Eso es raro. Y los votos a favor serían muy útiles, lo probé en algunas computadoras más, y 4/15 tener este problema. ¡Gracias! ¿Algunas ideas?

Funciona bien en PC Firefox y todos los demás navegadores, pero en 4/15 computadoras en Mac Firefox, Javascript es terriblemente lento, específicamente la barra de menú. Los probé a ambos fuera del sitio y funcionaron bien. Este ha sido un problema continuo durante bastante tiempo, no tengo idea de cómo resolverlo. Actualizado, el problema desaparece si elimino los PNG transparentes del sitio, como el banner en la parte superior izquierda.

Mi sitio: http://thenozzle.net/

Todo el javascript es un poco más lento que en otros navegadores, los dos más grandes son la barra de menú y el reproductor de video. No puedo ignorarlo en este momento.

Me pregunto si es algo que wordpress está agregando, porque js funciona bien en otros lugares.

¿Algunas ideas?

ETA: Aquí está mi archivo JS:

http://thenozzle.net/wp-content/themes/twentyten/scripts.js

ETA: Aquí está mi código de barra de menú

$(function() {
    $('#sdt_menu > li').bind('mouseenter',function(){
        var $elem = $(this);
        $elem.find('img')
             .stop(true)
             .animate({
                'width':'170px',
                'height':'170px',
                'left':'0px'
             },400,'easeOutBack')
             .andSelf()
             .find('.sdt_wrap')
             .stop(true)
             .animate({'top':'140px'},500,'easeOutBack')
             .andSelf()
             .find('.sdt_active')
             .stop(true)
             .animate({'height':'170px'},300,function(){
            var $sub_menu = $elem.find('.sdt_box');
            if($sub_menu.length){
                var left="170px";
                if($elem.parent().children().length == $elem.index()+1)
                    left="-170px";
                $sub_menu.show().animate({'left':left},200);
            }
        });
    }).bind('mouseleave',function(){
        var $elem = $(this);
        var $sub_menu = $elem.find('.sdt_box');
        if($sub_menu.length)
            $sub_menu.hide().css('left','0px');

        $elem.find('.sdt_active')
             .stop(true)
             .animate({'height':'0px'},300)
             .andSelf().find('img')
             .stop(true)
             .animate({
                'width':'0px',
                'height':'0px',
                'left':'85px'},400)
             .andSelf()
             .find('.sdt_wrap')
             .stop(true)
             .animate({'top':'25px'},500);
    });
});

Question 2

Le sugiero que tenga algunos PNG ligeramente dañados.

Le sugerimos que intente lo siguiente: vuelva a guardar los PNG fuera de Photoshop. Guarde tanto PNG-24 como PNG-8. Prueba .

He visto esto antes con archivos PNG que no se guardaron correctamente.

Probé el sitio en dos macbooks pros, uno core duo 2 y el otro core duo. Ambos funcionaron bien, el menú respondió muy bien incluso mientras se reproducía el video.

Suponiendo que tiene uno de los otros pasos enumerados en otras respuestas aquí en los “macs sospechosos” (es decir, creó nuevas cuentas y las probó), entonces creo que necesita ver qué más hace que esos Mac sean diferentes. ¿Qué versión de OS X? ¿Qué modelo ( es decir, macbook vs Macbook pro vs Air, etc.)

Question 3

Firefox 4.0 en Mac debería usar OpenGL para la aceleración de hardware, mientras que FF en Windows usa Direct2D. Dado que el problema solo ocurre en algunas Mac, ¿podría tener algo que ver con el conjunto de chips de su tarjeta gráfica; tal vez compare las especificaciones de las Mac infractoras y también intente desactivar la aceleración de hardware para ver si los problemas desaparecen?

Question 4

Intente crear un nuevo perfil de Firefox para que pueda ejecutarlo sin extensiones, complementos, etc. instalados. Puede ser que alguna extensión (AdBlock, GreaseMonkey, etc.) esté en conflicto con algunos de los scripts en su página de alguna manera.

Acabo de probarlo en FF4 en mi Mac (MacBook Pro, 10.6.7) y se cargó rápidamente, por lo que puede ser algo en su configuración.

Question 5

Primero validaría el HTML, ya que es posible que las etiquetas HTML se abran y produzcan un comportamiento extraño con javascript. Valida tu HTML y usa Firebug para ayudarte.

Después de eso, intentaría usar un espaciador diferente como este.

Question 6

No sé si Firefox tiene el mismo problema, pero sé que si coloca mosaicos png pequeños transparentes (como 1×1), causará una pérdida de memoria en ie7. Usando una imagen más grande arreglarlo.

¿Ha sido útil esta solución?