以下是我尝试查找可在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;
}
}