PDA

View Full Version : mootools - flicking an elements class (addClass/removeClass) - best practice


chidge
05-21-2010, 06:53 PM
Hi all.

I am a rookie in Mootools but have a background of Js development.

I am wondering what advice people have on flickering an items class on and off. Say to get an effect of the border flashing on and off.

So the way I see it I addClass and then removeClass using setTimeout, and a closure and a for loop.

thus enabling me to flick the border on and off a certain number of times.
off top of my head something like this: (maybe errors just used to demonstrate what I mean)

var reps = 100;

reps.each(function(i){

setTimeout(function(){
var pos = i;

if(i%2){
$$(.blah).addClass('on');
}else{
$$(.blah).removeClass('on);
}
}, (pos + 10) * 1000);

});




#css
.blah {
border:1px solid;
}
.on {
border:1px solid red;
}


I am wondering if there is a better way to do this in Mootools?

As always any light shedding on the matter is hugely appreciated.

Thanks

chidge
05-21-2010, 08:59 PM
sussed :)


$('morphExample').set('morph', {
link: 'chain',
duration: 1000
});
$('morphExample').morph('.two').morph('.one').morph('.two').morph('.one');