Selectize — Dans la lignée de Chosen, Select2, and Tags Input, Selectize est une surcouche Javascript développée par @brianreavis avec jQuery pour moderniser l’élément HTML select
dans l’optique d’améliorer l’expérience utilisateur dont cet élément a bien besoin. Selectize sera en tout cas bien pratique pour la gestion des tags, des listes de contacts, la sélection des pays, etc. Le tout pour un poids modique de 7kb (gzipped).
Archives de la catégorie : Helper HTML
jQuery++ — Extension du domaine de jQuery
Lawnchair — Le stockage JSON simplifié
Lawnchair est une solution souple et légère (3.4K pour la version minifiée) pour assurer la persistance des données de vos applications mobiles HTML5 grâce au format de données JSON. Par défaut, Lawnchair utilise les fonctions natives du navigateur, et utilise des solutions alternatives si les fonctions Storage ne sont pas prises en charge. Cerise sur le gâteau, cette solution ne dépend pas de jQuery ou d’un autre framework pour fonctionner. →
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.
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. →
jQuery File Upload
jQuery File Upload est un plugin basé sur jQuery et HTML5. Il ne nécessite aucun module pour votre navigateur comme c’est le cas pour les Uploaders réalisés avec Flash. Parmi ses fonctionnalités, jQuery File Upload, permet d’uploader des fichiers multiples en affichant une barre de progression pendant le téléchargement ainsi qu’une miniature si votre fichier est une image. →
jQuery radioSwitch — Transformez vos boutons radio en Sliders
jQuery radioSwitch est un plugin créé par Ammon Casey dont l’objectif est de transformer des boutonsradio
HTML en superbes Sliders d’un coup de magie CSS3 et Javascript. Il suffit d’envelopper les boutons radio
avec un container sur lequel s’effectuera l’appel de la fonction. Chaque bouton radio
doit posséder un label
avec l’attribut for
pointant vers l’identifiant du bouton correspondant. →
«input type = password» — Affichage des mots de passe à la demande avec jQuery
Afficher ou masquer les mots de passe de vos formulaires en jQuery — Le comportement normal d’un champ input
de type password
en HTML est de masquer les caractères en cours de frappe en les remplaçant par des bulles pour garantir la confidentialité de votre mot de passe. Pratique, au cas où quelqu’un lirait par-dessus votre épaule ou vous épierait avec une paire de jumelle. Si ce comportement par défaut a son utilité, il pourrait être intéressant d’avoir le choix et de n’afficher ou masquer ce mot de passe qu’en cas de besoin, à l’aide d’une case à cocher. →
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.
Étendre la zone cliquable d’un lien à l’élément parent avec jQuery
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 : →