IE 9没有渲染CSS转换。我有什么问题?

时间:2013-11-09 00:37:41

标签: css internet-explorer cross-browser

以下是我尝试查找可在IE9中运行的语法的一些资源,但绝对不是全部资源:

http://files0.cnitblog.com/jv9/Migrating_Consumer_Preview_App_to_Release_Preview.pdf

http://msdn.microsoft.com/en-us/library/ie/ff975245(v=vs.85).aspx

http://msdn.microsoft.com/en-us/magazine/ff728624.aspx

How to create an event when the animation ends?

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener

......这是研究了所有这些之后的代码。

    function callback(Own33){
        return function(){
            var IdentifyMe;
            var beSure;
            var JustONEmindU;
            IdentifyMe=document.getElementById(LeftDA);
            IdentifyMe.addEventListener("mouseout", PerformReset, false);
            IdentifyMe.className = (window.transitionstart) ? "lessdark":"";
            JustONEmindU=document.getElementById(LeftDA);
            JustONEmindU.addEventListener("transitionend", function (evt) {
                var localone;
                localone = document.getElementById(LeftDA);
                localone.className = "LITel";
                localone.addEventListener("click", HeyClick3L, false);
            }, false);
        }
    }

和CSS:

    #LftTx1.lessdark{


 transition-duration:1s;
 transition-name: AnimOne;
 transition-timing-function: linear;
 transition-delay: 0s;
 transition-iteration-count: 1;
 transition-play-state: running;
 transition-direction: normal;

}
@keyframes AnimOne{
from{
top:3.9%;
width:11%;
height:25%;
opacity:0.6;
padding-top:0px;
padding-bottom:3.3%;
padding-left:1%;
border-top:1px solid red;
border-right:4px solid yellow;
border-bottom:1px solid red;
border-left:1px solid red;
border-top-left-radius:3px;
border-top-right-radius:3px;
border-bottom-left-radius:3px;
border-bottom-right-radius:3px;
text-align:left;
color:orange;
font-size: 0.7rem;
}
to  {
top:-18.7%;
width:15.7%;
height:25.3%;
padding-top:0.33%;
padding-bottom:4.7%;
padding-right:1.3%;
opacity:0.9;
border-top:2px solid #77702B;
border-right:2px solid #77702B;
border-bottom:2px solid #77702B;
border-left:2px solid #77702B;
border-top-left-radius:5px;
border-top-right-radius:5px;
border-bottom-left-radius:5px;
border-bottom-right-radius:5px;
text-align:center;
color:#00B800;
font-size:1.1rem;
}
}

1 个答案:

答案 0 :(得分:2)

它根本不起作用,因为IE9<

都不支持CSS3 transitionsanimations