javascript - jQuery, Animate opacity to 1 then remove the opacity property to make it better looking on IE - Stack Overflow

admin管理员组

文章数量:1026989

I tried the jQuery fadeIn animation in all browsers and it work good, but not that much on IE. the Alpha png images are so creepy after appending the CSS opacity, but i have an idea and i don't know how to implement it using jQuery.

The idea is to fadeIn the element and when the animation is finished it will automatically remove the opacity property in order to make the picture quality better.

How to do that?

Note: i'm using Animate and not FadeIn.

Thanks

I tried the jQuery fadeIn animation in all browsers and it work good, but not that much on IE. the Alpha png images are so creepy after appending the CSS opacity, but i have an idea and i don't know how to implement it using jQuery.

The idea is to fadeIn the element and when the animation is finished it will automatically remove the opacity property in order to make the picture quality better.

How to do that?

Note: i'm using Animate and not FadeIn.

Thanks

• javascript
• jquery

Share Improve this question Follow asked Apr 8, 2010 at 22:47 EmilyEmily 91533 gold badges1010 silver badges1313 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

If you set the opacity with jQuery to begin with (as 0):

$(object).css("opacity", 0); 

then after you fade it in, you can just:

$(object).fadeIn("slow", function(){ 
    $(object).css("opacity", "");
});

as the above answer didn't work for me in IE <= 8

You can do this:

$(selector).animate({opacity: 1}, function() {
  $(this).get(0).style.removeAttribute('filter');
});

The filter IE uses is what causes ClearType to basically turn off. Remove that style attribute after the fade pletes like the code above to restore ClearType to working order. You can also find replacement fadeIn(), fadeOut() and fadeTo() methods that deal with this issue here: http://malsup./jquery/fadetest.html

I tried the jQuery fadeIn animation in all browsers and it work good, but not that much on IE. the Alpha png images are so creepy after appending the CSS opacity, but i have an idea and i don't know how to implement it using jQuery.

The idea is to fadeIn the element and when the animation is finished it will automatically remove the opacity property in order to make the picture quality better.

How to do that?

Note: i'm using Animate and not FadeIn.

Thanks

I tried the jQuery fadeIn animation in all browsers and it work good, but not that much on IE. the Alpha png images are so creepy after appending the CSS opacity, but i have an idea and i don't know how to implement it using jQuery.

The idea is to fadeIn the element and when the animation is finished it will automatically remove the opacity property in order to make the picture quality better.

How to do that?

Note: i'm using Animate and not FadeIn.

Thanks

• javascript
• jquery

Share Improve this question Follow asked Apr 8, 2010 at 22:47 EmilyEmily 91533 gold badges1010 silver badges1313 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

If you set the opacity with jQuery to begin with (as 0):

$(object).css("opacity", 0); 

then after you fade it in, you can just:

$(object).fadeIn("slow", function(){ 
    $(object).css("opacity", "");
});

as the above answer didn't work for me in IE <= 8

You can do this:

$(selector).animate({opacity: 1}, function() {
  $(this).get(0).style.removeAttribute('filter');
});

The filter IE uses is what causes ClearType to basically turn off. Remove that style attribute after the fade pletes like the code above to restore ClearType to working order. You can also find replacement fadeIn(), fadeOut() and fadeTo() methods that deal with this issue here: http://malsup./jquery/fadetest.html

本文标签：