Why does this happen? Any workarounds?
jQuery:
$(function() { $('p.quote').fadeIn(3000); });
HTML:
<p>someone said:</p> <p class='quote'>“lorem ipsum”</p> <p>someone else said:</p> <p class='quote' style='display: none;'>“magna carta”</p>
There is a known bug with IE and the fadeIn/fadeOut functions and their effect on text elements. Check out the info here:
http://blog.bmn.name/2008/03/jquery-fadeinfadeout-ie-cleartype-glitch/Looks like my original link has since gone dead. Updated with a different solution from the comments:
http://malsup.com/jquery/cycle/cleartype.html
The workaround is to remove the ‘filter’ property of the element in a callback function after fadeIn() has finished.