views:

33

answers:

2

Hey. I'm trying to get this script to work smoothly in webkit (Safari, Chrome, newest versions). It runs absolutely fine in Firefox. This code is called in the document.ready function:

$('#noScript').remove();  
$("#content div.wrapper, #top div.wrapper").hide().stop().fadeIn({duration: 2000, queue: true });

$('#social a')
.children('span').hide()
.next('img').css('opacity', '0.4')
.parent().hover(function(){
    $(this).children('img').animate({ opacity : 0.99}, {duration: 100, queue: false })
    .prev('span').fadeIn({duration: 200, queue: false });
}, function(){
    $(this).children('img').stop().css({ opacity : 0.4})
    .prev('span').hide();
});

$('#language').css({opacity: '0.5'}).hover(function() { 
    $(this).animate({ opacity : 0.99}, {duration: 'fast', queue: false }) 
}, function(){ 
    $(this).animate({ opacity : 0.5}, {duration: 'fast', queue: false }); 
});

Hovering over the selected items triggers an awfully slow animation. You can see a live example here: trinkaus.cc

Does anyone have any clue why this happens? Kind regards Sascha

A: 

It seems to be fine in Google Chrome 6.0.472.63 and IE 8, not had a chance to test it in Safari. Maybe clear your cache or something?

Noctine
Oh, since you're running IE8, it seems that you've tested Chrome on Windows. I have to point out, that I'm currently just testing under OSX. I've cleared my cache multiple times. I think there is really something wonky with either webkit/osx or my script :/
Sascha Michael Trinkaus
I take it is the latest version of whichever browser you are using? I'll have a play and see if I can replicate the issue.
Noctine
Okay so just tried on: IE 8,7,6. Chrome 6. Firefox 4, 3.6, 3.5, 3, 2. Safari 5,4,3. Opera 10. All worked fine, even IE 6!
Noctine
Wow, thanks man :)
Sascha Michael Trinkaus
I have to get used to this comment system sending every single comment when pressing return. So you don't experience any lag?
Sascha Michael Trinkaus
When first loading up there is slight lag on Firefox 3,2 and IE 7 I believe. But after that it's fine. Your CSS is insane so that could be a problem. You shouldn't really need webkit to change opacity, unless you are using it for something else? Try removing all CSS and then see what happens.
Noctine
I don't have any problems with Firefox - just Safari and Chrome (OSX) are so freakishly laggy. You may be right regarding the css (I've removed lots of html content but left the css intact) - it's quite huge. I don't think it's totally overblown though.. Thanks again!
Sascha Michael Trinkaus
A: 

Wow, I think I have to answer my own question. The inset shadow on the #top div is the cause of the JS performance.

Sascha Michael Trinkaus