Microjs.com présente près de 200 frameworks Javascript petits mais costauds. De combien de lignes de code avez-vous besoin pour votre projet de site web : 50K, 100K, 150K ? Ok, nous aimons tous nos bons vieux gros frameworks comme jQuery ou Mootools et nous en tirons souvent le meilleur. Mais combien de fois les avons-nous utilisés à mauvais escient ? Combien de fois avons-nous tenté d’écraser une mouche avec un tank, alors que des solutions bien plus adaptées étaient à notre portée ? →
-prefix-free de Lea Verou ajoute les préfixes vendeur pour les propriétés CSS3 et les navigateurs qui le nécessite. →
yepnope.js permet de charger un script de manière asynchrone selon qu’une fonctionnalité est disponible ou non dans le but de ne charger que l’essentiel. C’est le compagnon idéal de Modernizr qui se charge de détecter les fonctionnalités en question (cf. Modernizr — Détection des fonctionnalités CSS3 et HTML5). Un Polyfills est une fonction (généralement en Javascript) qui émule une fonctionnalité pour les navigateurs ne la prenant pas en charge (cf. What is a Polyfill?). Grâce à Modernizr et yepnope.js il est possible d’utiliser les fonctionnalités HTML5 et CSS3 en première intention tout en ménageant une porte de sortie pour les navigateurs plus anciens. →
CSS3-MediaQueries-JS est une bibliothèque Javascript qui permet d’utiliser les Medias Queries dans IE 5+, Firefox 1+ et Safari 2 — Firefox 3.5+, Opera 7+ et Safari 3+ étant nativement compatibles avec cette propriété CSS3. Les Medias Queries offre un mécanisme pour isoler certaines propriétés ou pré-requis techniques pour appliquer aux agents utilisateurs correspondants une déclaration ou une feuille de style CSS spécifique. →
Pour les injecter les balises HTML5 dans le DOM et leur appliquer la propriété CSS display: block pour les styler, Remy Sharp a mis au point html5shiv qui est toutefois sans effet lorsque les balises HTML5 sont affichées via innerHTML. Heureusement, HTML5 innerShiv est là pour que les version 6 à 8 d’Internet Explorer tiennent compte des nouvelles balises HTML5 créées à la volée.
Outre un nouveau design sombre que je trouve très réussi, Soh Tanaka nous offre une belle leçon de choses en utilisant le pseudo sélecteur :nth-child() et une pincée de jQuery (compatibilité Internet Explorer oblige) pour donner du rythme à une liste de produits contenant des éléments récurrents de tailles différentes. Rassurez-vous, le concept est très bien expliqué avec moult illustrations dans l’article Advanced Columns using the :nth-child(N) 😉
ChangeClass — Changer une classe CSS à la volée. Trouvé sur cet excellent article de Noupe sur l’utilisation de Javascript et de jQuery pour la majorité des solutions pour régler 12 problèmes courant liés aux navigateurs. Via @zeubeubeu. →
Pour étendre la surface cliquable d’un lien les CSS sont bien utiles : il suffit d’augmenter le padding de l’ancre concernée. Mais ne serait-il pas judicieux de rendre cliquable l’élément parent d’un lien ? C’est ce que propose Eroan Boyer dans son billet Étendre la portée d’un lien avec Jquery : →
David Walsh s’est penché sur l’affichage du «doigt qui clique» lorsqu’on ajoute un événement click ou hover sur un élément du DOM : →
