Posts

Showing posts from March, 2010

Safari and JQuery problem with fading in

I was recently working on a site where the client wanted a large image slowly faded in when the page loaded. In the past I might have used flash for this, but thought that the same effect could be achieved these days with javascript -- jquery, to be precise. And it can, as two minutes reading the docs will show you. It's in theory as simple as doing $(document).ready(function() { $('div#intro').hide(); $('div#intro').fadeIn(3000); }); This works, but I noticed it gave me a FOUC when viewed in safari (a flash of ugly content). The div would pop up for a microsecond, then vanish, then perform its gentle fadeIn. I first messed around with trying to hide the div before the document was ready, reasoning that the "hide" call was coming slightly too late. But this appeared to make no difference -- and indeed, if you only call hide() without then calling fadeIn() there is no FOUC problem. The actual fix (and I've no clear notion why this works, other than t