Animate opacity doesn't work properly on IE

Question

I\'m trying to use animate() to change the height and opacity of a div. The div has an image background in CSS. It works fine on Firefox and Safari

Answer 1

In jQuery, once the div is set to have either opacity:0 (in Standards Compliant Browsers) or filter:alpha(opacity=0) in IE, you can just use

$('#div').animate({opacity:1},100);

Since jQuery supports cross-browser support, if you end up animating the filter via IE, then chances are jQuery is trying to support IE and the conflict comes when jQuery fires the opacity change x2.

I hope this helps. I have had the same issue, plus odd issues with IE not being able to handle fading on a div stack with multiple items in it.