Font anti-aliasing issues with jQuery.fadeIn in IE8?

internet-explorer, javascript, jquery

Solution

As previously explained, this is caused by Cleartype in Internet Explorer- but there is a workaround that will at least make this issue tolerable.

$('#navigation').fadeIn(500, function(){
    if ($.browser.msie){this.style.removeAttribute('filter');}
});

That should force IE to clear the transparency and thus render the text normally.

It still isn't pretty, unfortunately.

Problem

I'm banging my head against the wall with an issue I'm having in IE8. I am using the fadeIn function on jQuery to make the site content fade in. This works perfectly fine in all of the other browsers, but when the fadeIn finishes in IE8 the font anti-aliasing seems to change, causing the text to shift slightly. You can see the site at http://www.ipulse.biz. The code I'm using to cause the fade in is quite simple, as shown below. ``` var showContent = function() { $('#content div:first').fadeIn(1000); $('#navigation').fadeIn(500); } // end showContent ``` The code is called by a setInterval function, if that makes any difference.

Original source