JavaScript探测CSS动画是否已经完成的方法
不啰嗦上代码：
WN:(function(){
varel=$('<fakeelement>'),
transition="transition",
transitionEnd,
animEvent={'start':null,'iteration':null,'end':null},
vendorPrefix;
transition=transition.charAt(0).toUpperCase()+transition.substr(1);
vendorPrefix=(function(){//现在的opera也是webkit
vari=0,vendor=["Moz","Webkit","Khtml","O","ms"];
while(i<vendor.length){
if(typeofel.css(vendor[i]+transition)==="string"){
returnvendor[i];
}
i++;
}
returnfalse;
})();
transitionEnd=(function(){
vartransEndEventNames={
WebkitTransition:'webkitTransitionEnd',
MozTransition:'transitionend',
OTransition:'oTransitionEndotransitionend',
transition:'transitionend'
}
for(varnameintransEndEventNames){
if(typeofel.css(name)==="string"){
returntransEndEventNames[name];
}
}
})();
animEvent.end=(function(){
varanimEndEventNames={
WebkitAnimation:'webkitAnimationEnd',
animation:'animationend'
}
for(varnameinanimEndEventNames){
if(typeofel.css(name)==="string"){
returnanimEndEventNames[name];
}
}
})();
animEvent.iteration=(function(){
varanimIterationEventNames={
WebkitAnimation:'webkitAnimationIteration',
animation:'animationiteration'
}
for(varnameinanimIterationEventNames){
if(typeofel.css(name)==="string"){
returnanimIterationEventNames[name];
}
}
})();
animEvent.start=(function(){
varanimStartEventNames={
WebkitAnimation:'webkitAnimationStart',
animation:'animationstart'
}
for(varnameinanimStartEventNames){
if(typeofel.css(name)==="string"){
returnanimStartEventNames[name];
}
}
})();
return{
called:false,
addTranEvent:function(elem,fn,duration){
varself=this;
varfncallback=function(){
if(!self.called){
fn();
self.called=true;
}
};
functionhand(){
elem.on(transitionEnd,function(){
//elem.unbind(transitionEnd,arguments.callee);
fncallback();
});
}
setTimeout(hand,duration);
},
addAnimEvent:function(elem,name,fn){
elem.on(animEvent[name],fn);
},
removeAnimEvent:function(elem,name,fn){
elem.unbind(animEvent[name],fn);
},
setStyleAttribute:function(elem,val){
if(Object.prototype.toString.call(val)==="[objectObject]"){
for(varnameinval){
if(/^transition|animation|transform/.test(name)){
varstyleName=name.charAt(0).toUpperCase()+name.substr(1);
elem.css(vendorPrefix+styleName,val[name]);
}else{
elem.css(name,val[name]);
}
}
}
}
};
})(),
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。
热门推荐
3 祝福语简短的微信
10 幼儿祝福语大全简短贺卡
11 感谢教官文案祝福语简短
12 鼠年同事祝福语简短创意
13 元旦祝福语 简短独特群发
14 妈咪跟我生日祝福语简短
15 给儿子新婚祝福语简短
16 伴娘祝福语长文案简短
17 恭喜高考完祝福语简短
18 生日祝福语送老公简短