ie opacity problem, tween css class ? obj.class1 to obj.class2

[Reemak]

Hi,

When I realised my opacity tweens weren't working in IE8, i thought i would create two classes :

.on{

filter:alpha(opacity=100);

filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);

opacity: 1;

 

}

 

.off{

filter:alpha(opacity=0);

filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);

opacity: 0;

}

 

and then tween my objects class... Is it possible ?

 

Any other idea to avoid that opacity problem ? => i checked the FAQ saying opacity is ok on every explorer, i might have some other problem somewhere else, but i would still like to know if it is possible to tween the class itself...

Pleeeeeeeease

[Carl]

Hi,

 

CSS opacity tweens should work fine in IE8. IE8 does have a serious bug though which prevents child elements from inheriting the opacity of the parent. In other words, if you tween a parent's opacity to 0, the child elements will still remain visible.

 

Is this what you are experiencing?

 

Check this jsfiddle in IE8: http://jsfiddle.net/geekambassador/xXvjc/

 

You will see that in the first example, the orange box (parent) fades, but the black box (child) does not.

 

The second black box has

 

filter: inherit;

applied which allows it to fade with it's parent.

 

Does this help?

 

If not, please provide a simple example illustrating that the opacity tweens aren't working. Would love to see if it is something we can fix.

 

I'm not so sure you can tween ms filters by tweening the class as you suggested.

I'll see if I can get a better answer for you.