0

遷移アニメーションが終了したら設定したいです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);
4

1 に答える 1

0

CSS トランジションの終了はイベントをトリガーするtransitionEndため、正確に知ることができます。これらのイベントはベンダー プレフィックスを使用しているため、それに対処する必要があります。Chrome/Webkit の場合は次のようになりますwebkitTransitionEnd。

j.on('webkitTransitionEnd', function(event) {
    handler.animating = false;
});

必須の JSFiddle

于 2012-12-03T04:11:24.457 に答える