MooTools 效果链答案

【问题标题】：MooTools Effect ChainingMooTools 效果链
【发布时间】：2010-12-07 14:43:26
【问题描述】：

我希望能够做这样的事情：

var fx = new Fx.Tween($('element'), {
    duration: 500,
    property: 'opacity',
    transition: Fx.Transitions.Quart.easeOut,
    link: 'chain'
});

fx.start(0, 1)
.chain(function() {
    alert('foo');
})
.start(1, 0)
.chain(function() {
    alert('bar');
});

然后淡入#element，然后运行一个函数。但是，我无法让它在第一个 chain() 之后运行第二个启动，这意味着 #element 不会重新消失。

感谢您的帮助

【问题讨论】：

你可以做这样的事情jsfiddle.net/dimitar/FkCgY (1.2.x+) 你在 1.12 是偶然的吗？
我使用的是 1.3（截至昨天网站的最新版本）。我已经有一个类似于使用嵌套的方法（有效），但我宁愿避免这种方法并使用简单的链接机制。
别担心，我们也得到了 :) jsfiddle.net/dimitar/FkCgY/4 扩展类时链的工作方式：mootools.net/docs/core/Class/Class.Extras#Chain
谢谢，这更接近我的想法，现在已经实现了。有没有办法得到与上述类似的东西？在我看来，它是最优雅的。我尝试在 Fx.Tweet 中实现 Chain，但没有成功。
我不这么认为。 instance.chain().something() 似乎不起作用，因为链不会一目了然地返回实例，我可能是错的。

标签： mootools

【解决方案1】：

事实证明，与上面的代码非常相似的东西可以工作，只是你需要使用 callChain() 才能触发下一个“链接”。这就是我现在正在使用的：

var effect = new Fx.Tween($('element'));
effect.start('opacity', 1)
.chain(function() { /* Do stuff */ this.callChain();)
.chain(function() { /* Do stuff */ this.callChain();)
.chain(function() { /* Do stuff */ this.callChain();)
.chain(function() { /* Do stuff */ this.callChain();)
.chain(function() { /* Do stuff */);

等等。

这是因为chain返回的是Chain类的实例，而不是Fx.Tween的实例。我有点恼火我需要使用 callChain() 但它比拥有大量嵌套函数要好。

【讨论】：