MooTools Effect Chaining

I'd like to be able to do something like this:

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');
});

Which then fades in #element, and then runs a function. However, I can't get it to run the second start 开发者_Python百科after the first chain(), which means that #element isn't fading back in.

Thanks for your help

It turns out that something very similar to the above code can work except you need to use callChain() in order for the next "link" to fire.. This is what I'm using now:

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 */);

And so on.

This is because chain returns and instance of the Chain class, rather than an instance of Fx.Tween. I'm a little annoyed that I need to use callChain() but it's better than having loads of nested functions.