javascript - YUI Anim on After 事件？

Question

有没有办法在动画完成后触发事件？它的成本是什么？我对 YUI 库很陌生，我迷路了..

我现在的情况是

    var anim = new Y.Anim({
        node: node,
        duration: 1.0,
        easing: Y.Easing.easeOut
    });

...ETC

注意：这适用于 YUI2。

Answer 1

要在动画完成后做一些事情，你只需要监听“结束”事件：

var anim = new Y.Anim({
    node: node,
    duration: 1.0,
    easing: Y.Easing.easeOut,
    on: {
        end: function (e) {
            // your stuff here
        }
    }
});

Answer 2

是的！就像是：

var myAnim = new YAHOO.util.Anim("yourId", {
   left: {from: 0, to:75}
}, 1);

myAnim.onComplete.subscribe(function() {
   alert('Done!');
});

有关更多示例，请参见http://developer.yahoo.com/yui/examples/animation/index.html。

Answer 3

这个想法是，由于动画需要时间，您可能希望在动画完成时收到通知以执行您可能需要的任何其他逻辑：以下是该事件的一些用途：

1. 动画完成后触发其他动画。这可以在同一元素上，也可以在 UI 的完全不同部分上。
2. 从 DOM 中移除元素。也许它是一个弹出窗口，一旦关闭（带有动画），DOM 中就不再需要它了
3. 其他的东西，比如用内容填充元素等。