RadioSwitch = input[type=radio] + CSS3 + originalité
Avec la venue du CSS3, on a clairement explosé les limites de ce qu’il était possible de faire avant en terme de création graphique. Même si les spécifications ne sont pas encore complètes, il est utile de ce mettre à jour pour savoir ce qui est maintenant possible. Je pense, certains ne seront pas d’accord, que le CSS3, et le HTML5 tant qu’on y est, doit être utilisé sans hypocrisie et à 100%. Dans le sens où on voit parfois des arrondis faits avec border-radius, puis ben pour le bouton on va prendre une image parce que le dégradé c’est chiant à faire.
Donc oui le web designer doit connaître ce que permet le CSS3 à un instant T. Oui le web designer doit savoir intégrer son .PSD, mais c’est un autre débat qui fera office d’article. Bref, je ferme cette grosse parenthèse et vais vous présenter un petit truc sympa.
Ammon Casey a développé un plugin jQuery plutôt cool, qui va vous permettre de changer vos champs de formulaire, de type radio, comme sur l’image. Ce plugin utilise essentiellement du CSS3 pour modifier le rendu, et un peu de javascript pour gérer les clics.
Le code source est disponible, et c’est une bonne lecture pour apprendre à faire des effets comme les dégradés, les ombres internes etc. L’auteur pense mettre en place bientôt un mode dégradé avec des images pour les anciens navigateurs. C’est son choix, pour ma part les anciens navigateurs peuvent allez se faire voire, et leurs utilisateurs aussi. Just kidding.
Maintenant place à la démo — hébergé chez votre serviteur — et un lien vers les sources. Pensez à souscrire au github, pour être tenu au courant des commits.
