Archive for September 26, 2011

jQuery fadeIn and fadeOut: IE bug workaround

September 26, 2011

This post was originally published in the Rambling Labs Blog on September 26, 2011.

I was trying to do some cool effect on a project I’m working on by fading in the front page. The trick looks really nice and it’s easy to implement.

Just make the body hidden like this:
```
<body style="display: none;">
```
And in the JavaScript file do this:
```
$(function(){
  $('body').fadeIn(2000);
});
```
Checked it out on Firefox and Chrome. It works perfectly, so smooth. And that’s it!… Or so I thought…

Checked it out in IE 8 or less and, oh surprise, it doesn’t work. It fades in the background, but the rest of the page is shown with no transparency or fading in at all.

But why?? Because some elements have a position: relative; or position: absolute; in their…
Continue Reading →