Pour enrichir vos sites internet, il peut être sympa d'ajouter des effets de survol progressif à vos liens, boutons, images, illustrations... Pour cela, mootools est parfaitement adapter et permet très facilement d'ajouter un gestionnaire d'évènement sur certains éléments !

Prenons l'exemple d'un effet de changement de couleur progressif de la couleur d'un texte d'un lien au survol de celui ci:



var fx = new Fx.Styles($('idElement'), {duration:200, wait:false});
 
$('idElement').addEvent('mouseenter', function(){
fx.start({
'background-color': '#666'
});
});
 
$('idElement').addEvent('mouseleave', function(){
fx.start({
'background-color': '#333'
});
});



Voila, l'exemple est assez simple, il ne reste plus qu'a paramétrer le Fx.Styles et le tour est joué !