Derrière ce titre un peu abscons se cache une astuce permettant d’accéder à un onglet et à une ancre spécifiques depuis une URL contenant les paramètres adéquats. L’idée est de pouvoir accéder au contenu des «tabs» sans être obligé de cliquer sur les onglets eux-mêmes. La proposition qui suit ne prétend pas être la meilleure dans le genre, mais elle a le mérite d’être fonctionnelle. →
Archives de la catégorie : Helper Javascript
10+ raccourcis Javascript à connaitre
jQuery.Storage — Plugin jQuery pour manipuler Storage HTML5
jQuery.Storage est un plugin jQuery qui permet d’utiliser simplement les fonctions d’enregistrement de données (localStorage et sessionStorage) disponibles dans HTML5. Son intérêt réside dans simplification de la sérialisation des données et dans la possibilité de basculer vers les cookies pour les navigateurs qui ne prennent pas en charge les nouvelles fonctionnalités Storage. jQuery.Storage est disponible sur Github.
http://140byt.es — Fonctions Javascript prêtes-à-Tweeter
140byt.es est une initiative proposée par Jed Schmidt avec l’aide de Alex Kloss, tout deux inspirés par Thomas Fuchs et Dustin Diaz. L’idée est de proposer une collection de fonctions Javascript occupent 140 caractères maximum, ce qui leur permet d’être directement publiables sur Twitter. →
microjs — 200 micro-frameworks Javascript
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 ? →
jQuery Boilerplate
Vous créez des plugins pour jQuery et vous parvenez à des résultats satisfaisants mais vous vous demandez si vous respectez les bonnes pratiques ? jQuery Boilerplate fournit un modèle de base de développement de plugins jQuery pour utilisateurs débutants ou plus avancés : objet, constructeur et options pour étendre les fonctionnalités.
→ jQuery Boilerplate est disponible sur github.
yepnope.js — Chargement conditionnel de scripts pour vos « Polyfills »
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. →
innerShiv — Le contenu HTML5 généré par innerHTML fonctionne enfin dans IE
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.
Chérie, j’ai rétréci document.getElementById
Une petite astuce toute simple mais néanmoins efficace pour simplifier l’accès aux identifiants CSS à la manière de jQuery. →
Clickoutside Event — Détectez les clics en dehors d’un élément
Clickoutside event — Ce plugin jQuery permet de déclencher une action lorsque l’utilisateur clique en dehors de l’élément spécifié. La gestion des événements de jQuery, déjà très complète, s’enrichit avec clickoutside. Pour 0.7 ko ce serait dommage de s’en priver. Ce plugin sera très utile pour fermer vos fenêtres modales (lightbox) lorsque l’utilisateur clique à l’extérieur. Voici un exemple d’utilisation : →