ie9 的过渡结束回退
Transition End Fallback for ie9
我将以下代码与 jquery 结合使用,以在 transitionend 上触发事件并避免多个 callback/support 多个浏览器:
function whichTransitionEvent(){
var t;
var el = document.createElement('fakeelement');
var transitions = {
'transition':'transitionend',
'OTransition':'oTransitionEnd',
'MozTransition':'transitionend',
'WebkitTransition':'webkitTransitionEnd'
}
for(t in transitions){
if( el.style[t] !== undefined ){
return transitions[t];
}
}
}
(此处找到代码:http://davidwalsh.name/css-animation-callback)
但是,不管prefix/syntax如何,ie9似乎都不支持transitionend。当我在如下场景中使用它时,我将如何为 ie9 设置回退(在动画完成后从 DOM 中删除加载屏幕)?
$('#loading').one(transitionEvent, function(event) {
$('#loading').remove();
});
我看过几个关于如何使用与此 post 顶部的函数类似的函数来防止多次回调的答案,但我只是不明白如何创建回退。感谢您的帮助!
var transitionEvent = whichTransitionEvent();
// bind your event
$('#loading').one(transitionEvent, function(event) {
$('#loading').remove();
});
// if event not supported e.g. IE <= 9
if (! transitionEvent) {
$('#loading').trigger(transitionEvent);
}
如果事件不受支持,函数 returns 一个虚假值(未定义)。
我将以下代码与 jquery 结合使用,以在 transitionend 上触发事件并避免多个 callback/support 多个浏览器:
function whichTransitionEvent(){
var t;
var el = document.createElement('fakeelement');
var transitions = {
'transition':'transitionend',
'OTransition':'oTransitionEnd',
'MozTransition':'transitionend',
'WebkitTransition':'webkitTransitionEnd'
}
for(t in transitions){
if( el.style[t] !== undefined ){
return transitions[t];
}
}
}
(此处找到代码:http://davidwalsh.name/css-animation-callback)
但是,不管prefix/syntax如何,ie9似乎都不支持transitionend。当我在如下场景中使用它时,我将如何为 ie9 设置回退(在动画完成后从 DOM 中删除加载屏幕)?
$('#loading').one(transitionEvent, function(event) {
$('#loading').remove();
});
我看过几个关于如何使用与此 post 顶部的函数类似的函数来防止多次回调的答案,但我只是不明白如何创建回退。感谢您的帮助!
var transitionEvent = whichTransitionEvent();
// bind your event
$('#loading').one(transitionEvent, function(event) {
$('#loading').remove();
});
// if event not supported e.g. IE <= 9
if (! transitionEvent) {
$('#loading').trigger(transitionEvent);
}
如果事件不受支持,函数 returns 一个虚假值(未定义)。