Question

I want to use method chaining in moo tools 1.2.

My requirements are as below.

When page load complete.

My one div element say “my_div” is set to hidden visibility.

After half second its opacity set to 0.4
Then again after half second its opacity set to 0.7
Then again after half second its opacity set to 1.

So how could i do this with chaining in moo tools 1.2.

And one more this.

I could i pass the parameter when i call delay method. For example

function demo(arg1, arg2)
{
  // Demo code will be here
}

So how could i call this function with delay of one second and also with passing this two arguments?

Answer 1

not sure why you need the gaps when you can do something like this (try it and see if it works better):

(function() {
    $("foo").set("tween", {duration: 1500}).setOpacity(0).fade(1);
}).delay(500);

but if you need to do it as per your specs without a tween, then do:

(function() {
    $("foo").setOpacity(.4).setStyle("visibility", "visible");
}).delay(500);

(function() {
    $("foo").setOpacity(.7);
}).delay(1000);

(function(message) {
    $("foo").setOpacity(1).set("html", message);
}).delay(1500, this, "hello");

no need for chaining as you are running the changes at preset times anyway, they don’t need to wait on each other. but the chaining class is awesome for animations as suggested, http://mootools.net/docs/more/Class/Chain.Wait

as for params, .delay supports: (ms, bind [this etc], arguments) (as per last cycle example that changes the div’s html)