jQuery FadeIn text in IE7/IE8 : text aliased during animation

Question

Hi,

I have trouble to make a good use of jQuery fadeIn() or fadeOut() for text divs in IE(both 7 and 8), as you can see in this example : http://jsbin.com/etatu3/5 (see the code here : http://jsbin.com/etatu3/5/edit )

I did some research and it seems it's because of filter opacity.

I tried using

animate({filter: (opacity = 50)},1000);

But of course it didn't work. I checked the hasLayout, it's on true.

Is there any solution for the text not to be aliased during the fade animation, because it's quite ugly for big titles like this ?

Thanks for your answers :)

Edit : just to be clear, as you can see in the example I included, I already use removeAttribute('filter'); This does the job after the animation, not during it.

Answer 1

Try adding a white background color to the element, it improves the animation but still does not make it perfect

http://jsbin.com/etatu3/17