Behaviour

Filed under: Développement Web — vincent.lark @ 17:10

Behaviour est une librairie JavaScript écrite par Ben Nolan permettant d’assigner des fonctions sur des éléments DOM.


Et alors ?
Il suffit de faire une recherche DOM, avec getElementByID ou avec Prototype,
puis d’appliquer les attributs que l’on veut.

L’avantage est de pouvoir sélectionner ces éléments avec des sélecteurs CSS, dans un Objet JavaScript de type Hash.
Par exemple :

var mon_style = {

‘#contenu a.class1′ : function(element) {

el.onmouseover = function(e) {

this.style.width = ‘100px;’;

}

}

}

Permet de donner, à tous les liens de classe “class1″ contenus dans l’élément d’id “#contenu”, une largeur de 100px.

Evidemment, on aurait pu faire la même chose en CSS, par exemple

#contenu button.class1 { width: 50px; }
#contenu button.class1:hover { width: 100px; }

Mais lorsque l’on travaille avec des effets (Script.aculo.us, MooFX, etc. ) cela devient réellement utile.
Exemple, avec un effet script.aculo.us :

var mon_style = {

‘#contenu a.class1′ : function(element) {

el.onmouseover = function(e) {

new Effect.Pulsate(Event.element(e));

}

}

}

On peut ainsi jongler avec différents objets de style, que l’on applique avec

Behaviour.apply(mon_style);

Sources, Demos et tutos sur le site de Ben Nolan : http://bennolan.com/behaviour/

Bon JavaScript !

No Comments
Chargement ...