jquery - 在不使用 .animate() 的动画结束时；

Question

我正在构建一个 iPad 网络应用程序。 .animate() 方法使用起来太慢了，这就是为什么我的大部分转换都是使用 css 完成的。我如何实现

html

<div id="myGallery" class="container"></div>

CSS

.container {
position: fixed;
-webkit-transition: -webkit-transform 0.25s ease-in-out;
}

.pos-1 {
-webkit-transform:translate3d(0px,0px,0px);
}

.pos-2 {
-webkit-transform:translate3d(100px,0px,0px);
}
.pos-3 {
-webkit-transform:translate3d(200px,0px,0px);
}

js

$("#myGallery").removeClass("pos-" + this.previousId).addClass("pos-" + this.currentId);

$("#myGallery").bind("webkitAnimationEnd", function() {
        // this.style.webkitAnimationName = "";
        console.log("done animating");
    });

我如何使用“webkitAnimationEnd”或者更确切地说，我如何在不使用 .animate() 的情况下触发“完成动画”？

Answer 1

您不能只将元素的类别从具有动画的类别更改为不具有动画的类别吗？

我是不是误解了这个问题？

你的意思是相反的吗？你想知道 css 动画什么时候结束？我假设您可以通过设置计时器并提前计算动画需要多长时间来做到这一点。