Slow jQuery animation in IE

Question

Hi, I have a site http://www.special4you.co.uk and has a animation nav made from balloons. This works and looks lovely in FF and Chrome but in all the IEs it looks pants as the animation is poor and jagged. Does anyone know why this or if it is my fault?

my code is:

$(document).ready(function(){
    Cufon.replace('h1, p, #address, h2');
    $(".balloon-nav").hover(function(hoverEvent) {
        $("a.balloon-nav").click(function(clickEvent, hoverEvent){
            clickEvent.stopPropagation();
            var element = $(this);
            var target = element.attr("href");
            var zIndex = element.css("z-index");
            element.attr("href", "#").css("z-index", "100");
            element.animate({ top: "0" }, 1500, 'easeOutBounce', function() {
                element.css("z-index", zIndex);
                window.location=target;
            });
        });
        var e = this;
        $(e).animate({ marginTop: "-14px" }, 250, function() {
            $(e).animate({ marginTop: "-10px" }, 250);
        });
    },function(){
        var e = this;
        $(e).animate({ marginTop: "4px" }, 250, function() {
            $(e).animate({ marginTop: "0px" }, 250);
        });
    }); 
});

Answer 1

This isn't your fault, Internet Explorer is slow, you'll have to live with that until Microsoft does something about it.

It runs slow because you have lot's of CSS changes in a small amount of time, maybe if you lower the amount of updates for IE it might help.

Answer 2

I have something that works fast in html 3.2 in IE, but not html 4.0 transitional in IE. Also works fast in every other browser under the sun whether html 3.2 or 4.0. Just not html 4.0 in IE. Absolutely incredible that 3.2 works way better than 4.0 in this case (only in IE).