Je pourais continuer dans mes Moliérerie, et vous inviter à faire comme Monsieur Jourdain de la prose sans le savoir, Mais je vais faire de vous amis lecteurs des créateurs de sites un peu plus geek le tout sans douleur ;o)
Je viens de découvrir Performer une bibliothèque javascript dont l’originalité est qu’elle de nécessite aucune ligne de code.
En quelques secondes et sans douleur vous allez pouvoir produire les meilleurs effets Jquery et mootols (ligthbox, menu déroulants, validation de formulaire)
Oui mais comment ?
En fait Performer utilise des balises de style, il suffit de donner un style particulier à une balise html pour que Performer lui applique un effet.
Supposons par exemple que nous souhaitions mettre en place un menu à onglet comme sur l’exemple 1
on a un code qui ressemble à peu près à ça
en premier lieu on insère dans le de la page un l’adresse de la librairie qu’on souhaite utiliser (ici Jquery) et un lien sur la librairie Performer.
on ajoute ensuite les styles
-
class= »inline »>
- « tabber tabGroup-tabs tab-tab1 » href= »# »>Onglet 1
- « tabber tabGroup-tabs tab-tab2 » href= »# »>Onglet 2
- « tabber tabGroup-tabs tab-tab3 » href= »# »>Onglet 3
-
id= »tabs »>
-
id= »tab1″ class= »tab »>Le premier onglet
-
id= »tab2″ class= »tab hider »>Le deuxième onglet
-
id= »tab3″ class= »tab hider »>Le troisième onglet
Puis au chargement de la page c’est magique on a des onglets qui fonctionnent tout seul, le tout sans une ligne de code.
En conclusion
Le gros inconvénient de performer est son manque d’accessibilité, en effet il détourne les arguments de style pour en faire des déclencheurs javascript, et toutes les informations de lien de page (par exemple pour les lightbox) sont passé en arguments.
Ses deux gros atouts sont :
- sa facilité de mise en oeuvre,
- et la très bonne qualité de la doc, qui (bien quen anglais) permet de rapidement par simple coupé collé de créer des effet bluffant.
Un très bon outil pour rendre son site un peu plus fun et pourquoi pas se découvrir l’âme d’un bouffeur de code
Pour aller plus loin
- Les exemples
- la librairie performer
- La documentation (en anglais)
Faites du javascript… sans javascript
Pas d‘accord avec :
« en effet il détourne les arguments de style pour en faire des déclencheurs javascript »
les classes, comme l‘id, n’ont /jamais/ été *réservées* aux css :
http://www.w3.org/TR/html4/struct/global.html#h-7.5.2
The class attribute has several roles in HTML:
* As a style sheet selector […]
* For general purpose processing by user agents. < -- ! rien d’inaccessible là-dedans, donc (et partant sur un contenu structuré, c’est même plutôt « propre »).
@eleg : Bien vu !