javascript - 如何在 mootools 中同时执行多个动画？

Question

我有两个 div（例如，具有 ids 的 div：div1 和 div2），我需要使用 Fx.Tween 扩展其高度并且我希望动画是同时的。

'#div1' 的 style.height 将从 auto 更改为 0。 '#div2' 的 style.height 将从当前高度更改为由名为calculateHeight()的函数计算的新高度

我怎么做？

Answer 1

Mootools 动画不会阻塞（JS 中的动画很少会阻塞！）所以简单地按顺序执行两个补间将产生所需的效果（与人类可以感知的一样接近）

function go()
{
    $('div1').tween('height', 0);
    $('div2').tween('height', calculateHeight());
}

function calculateHeight()
{
    return 0; //or whatever
}

Answer 2

我认为这与 wait:false 选项有关。我不是程序员，mootools 很容易，但并不那么擅长，但我记得读过一些文档，上面说你可以控制第二个动画是在第一个动画结束时立即工作还是同时工作。

链式方法：等待在链式事件之间注入暂停。句法

myClass.wait（持续时间）；

参数 1. duration - (integer) 暂停链栈的持续时间（以毫秒为单位）；默认为 500。

我认为您应该链接变形并使其等待（0）。但我不确定。希望这可以帮助。