How do I fix edgy text in FireFox from JQuery’s fadeIn() & fadeOut?

If you are noticing a problem with text appearing light, crunchy or edgy in FireFox while fading in and out, you’ve found the cleartype bug! You’ll have to remove the filter property from the DOM. Try this:

document.getElementById("#container").style.removeAttribute("filter");

You’ll have to use after the fadeIn function is complete or in the function callback as follows:

$("#container").fadeIn(  function() {
    this.style.removeAttribute( "filter" );
});

Back to Blog

Say Hello

You can reach me by email, I'd love to hear from you.