World Wise News


Recommended


Solution For jQuery Internet Explorer Jagged Text Animation

jQuery LogoWhile testing animating an insertion of an element with jQuery, I noticed the text was looking awfully jagged in Internet Explorer for the newly inserted text.

Here is an example screen shot

jagged-looking-text

It’s as if the new element has no ClearType font smoothing applied to it.

After countless Googling and testing, the following function, when called with the object that was created, makes the text back to looking smooth and silky.

function ieFixJagged(obj)
{
 if (obj.style.removeAttribute)
 obj.style.removeAttribute('filter');
}

An example of the use of this function with the show jQuery function

$('animatedText').show('slow', function()
 {
 ieFixJagged(this);
 });

Now the text will appear smooth after the animation, although still jagged during the animation.

Here is how it appears now when the function is applied to the objet

Cleartype Font Smooth

Do let us know in the comments if you found alternative solutions.


This entry was posted in programming and tagged . Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

© 2011 - 2017 World Wise News.