delay or setInterval in mootools

Question

Good morning,

I have a problem with mootools, and I make an alpha effect from 0 to 100 but I would like to make a delay before loading the next effect.

code is as follows:

<script type="text/javascript">
var miEfecto1 = new Fx.Style('texto42' ,'opacity',{duration: 9000,onComplete: function(){setInterval(miEfecto2.start(1,0) , 15000 );}});
var miEfecto2 = new Fx.Style('texto14' ,'opacity',{duration: 9000,onComplete: function(){setInterval(miEfecto3.start(1,0) , 15000 );}});
...etc...
var miEfecto59 = new Fx.Style('texto45' ,'opacity',{duration: 9000,onComplete: function(){setInterval(miEfecto60.start(1,0) , 15000 );}});
var miEfecto60 = new Fx.Style('texto39' ,'opacity',{duration: 9000,onComplete: function(){setInterval(miEfecto61.start(1,0) , 15000 );}});
window.addEvent('domready',function() {
miEfecto1.start(1,0);}); 
</script>

thank you very much for your help!

Tadeck · Answer 1 · 2012-01-18T15:15:52.397

1

setInterval sets interval for some function you pass as the first parameter, where setTimeout just delays the execution. Use the latter to avoid multiple execution.

Also in your code you immediately execute start() method (eg. miEfecto2.start(1,0)), because you do not pass it - you pass its result. To fix this you can enclose it in an anonymous function (but do not call it).

The example code could look like this (notice setInterval being replaced by setTimeout and that I enclosed the function call in anonymous function):

var miEfecto1 = new Fx.Style('texto42', 'opacity', {
    duration: 9000,
    onComplete: function(){
        setTimeout(function(){
            miEfecto2.start(1,0);
        }, 15000);
    }
});

Make similar changes in the rest of your code.

edited Jan 18 '12 at 15:15

answered Jan 18 '12 at 15:10

Tadeck

132,510
28
152
198

hello Tadeck! thank you very much for your response. It's okay, but this should do is delay the start of the next effect. effect is Alpha 100 to 0, then, before starting the fadeout should wait a few seconds. thank you very much and excuse my English – hectoralvaez Jan 18 '12 at 15:55
THANK YOU SO MUCH! You have given me the key to solving my problem! – hectoralvaez Jan 27 '12 at 08:52
@hectoralvaez: No problem, happy it helped. I saw you posted an answer with the solution being almost identical to mine - could you explain? – Tadeck Jan 27 '12 at 09:06
yes, the difference is that at the begining I only was one effect (fade in), then it were the pause, but I needed the pause with alpha 100% So now I make two effects "fade in" - interval - "fade out" Apologize for my english :) and thanks again! – hectoralvaez Jan 29 '12 at 12:44

score 0 · Answer 2 · answered Jan 18 '12 at 15:16

0

what you need to do is to chain the effects and set the delay to whatever you need..

check this example : http://demos111.mootools.net/Chain

or check the doc : http://mootools.net/docs/core/Class/Class.Extras

Hope this helps

answered Jan 18 '12 at 15:16

pleasedontbelong

19,542
12
53
77

=P lol... ok the new demo is in http://mootools.net/demos/?demo=Chaining but the code hasn't change – pleasedontbelong Jan 18 '12 at 15:45
he uses 1.1x anyway - based upon use of Fx.Style – Dimitar Christoff Jan 18 '12 at 17:18
thank you very much for your help, I could finally solve the problem another way, maybe another day I use your idea! THANK YOU! :) – hectoralvaez Jan 27 '12 at 08:57

score 0 · Answer 3 · edited Jan 27 '12 at 09:03

0

THE SOLUTION:

var miEfecto_i1 = new Fx.Style('texto19', 'opacity', {
    duration: 1000,
    onComplete: function(){
        setTimeout(function(){
            miEfecto_o1.start(1,0);
        }, 10000);
    }
});

var miEfecto_o1 = new Fx.Style('texto19', 'opacity', {
    duration: 1000,
    onComplete: function(){
        miEfecto_i2.start(0,1);
    }
});

THANKS!!

edited Jan 27 '12 at 09:03

Tadeck

132,510
28
152
198

answered Jan 27 '12 at 08:55

hectoralvaez

1
1

I formatted your code, the first part is almost exactly what I have proposed, the other does not have the delay. Could you explain, how my solution differs? – Tadeck Jan 27 '12 at 09:05

delay or setInterval in mootools

3 Answers3