我希望在转换动画结束后设置animating = false
,我使用settimeout,它在桌面上工作正常,但在ipad上时机错误,是否有可能知道对象的css动画完全结束?
CSS:
#pane{ -webkit-transition: -webkit-transform 1s ease-out ; }
JavaScript的:
function css_translate(j, k) {
var i = 'translate(' + k + 'px,0px)';
j.css({
'transform': i,
'-moz-transform': i,
'-webkit-transform': i,
'-o-transform': i,
});
}
if (animating == false) {
animating = true;
css_translate($pane, handler.page[handler.currentp + 1] * -1);
}
setTimeout(function() {
handler.animating = false;
}, transitiontime);
答案 0 :(得分:0)
CSS转换结束triggers a transitionEnd
event,因此您可以准确了解。这些事件正在使用供应商前缀,因此您需要处理...对于Chrome / Webkit,它是webkitTransitionEnd
:
j.on('webkitTransitionEnd', function(event) {
handler.animating = false;
});