Setting opacity of dynamically generated element in IE7

问题

I'm creating a div in js and setting it's opacity. This works no problem in IE8:

var div = document.createElement("div");
div.setAttribute("style", "opacity: 0; visibility: hidden; filter: alpha(opacity=0)");

This element fades in/out, which also works great in IE8:

if (_SU3.browser == "IE") {

    var op = element.filters.alpha.opacity;
    var newOpacity = op - (opacityStep * 100);

    if (newOpacity <= 0) {
        element.filters.alpha.opacity = 0;
        element.style.visibility = "hidden";
    } else {
        element.filters.alpha.opacity = newOpacity;
        _SU3.timeouts[url] = setTimeout(function() { _SU3.fadeOut(element, opacityStep); }, 100); 
    }

} else {

       .....
}

But it doesn't work in IE7: from the developer tool (F12) it looks like the styles are not being set when the div is created. No errors are reported. So I have tried this:

div.filters = 'alpha(opacity=0)';  

which errors "Object does not support this property or method". I also tried setting zoom: 1 but also to no avail. Any suggestions?

Thanks

回答1:

I believe the format for IE7 in JS is more like:

element.style.filter = "alpha(opacity="+ value +")"

回答2:

It is important to note that the alpha filter will not work in IE7 without also setting the width. This was a hard-earned discovery.

来源：https://stackoverflow.com/questions/5395550/setting-opacity-of-dynamically-generated-element-in-ie7