jquery running to soon. working only in chrome

I have set blog text in my page to opacity 0, so that it fades in to opacity 1 on page load with this code.

$(document).ready(function(){
    $('.entry').animate({opacity:1},700);
});

the text only fades in on chrome, in firefox the text is already set to opactiy 1 with no visible fade in effect.开发者_开发百科 I have tried to put the code in the footer, but the text is still visible when the page loads. I know for I.E I have to do it with a filter.

If fading is your only requirement use the jQuery fadeOut() and fadeIn() functions as they are more cross-browser safe than animating the opacity property.

It's a little hacky but you can try setting a timeout after the page has loaded...

$(document).ready(function(){
    setTimeout(function(){
    $('.entry').animate({opacity:1},700);
    },1000);
});

The ready() event fires as soon as the DOM is constructed. Have you tried using the load() event instead?