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, but when I test it in IE the background is being removed. This is my code:

if (jQuery.support.opacity) {
    jQuery('#list_box').animate({opacity: '1',height: '300px',top: newTop},{duration: 300});
} else {
    jQuery('#list_box').animate({filter: 'alpha(opacity=100)',height: '300px',top: newTop},{duration: 300});
}

How can I fix this problem?

Answer 1

Do you use some pngfix script ? that may be the culprit.

Answer 2

I noticed the problem was caused by position:relative of the container. If "switching" to absolute opacity animation will work.