jquery et ses plugins pour les applications en ligne
Sélection de plugins complétant jQuery pour réaliser des applications Web.
JQuery est le framework Ajax le plus utilisé. Cela n'en fait pas un choix obligé, il en existe d'autres qui ont aussi leurs avantages, mais cela permet de disposer d'une quantité de plugins qui étendent ses capacités.
Ce qui nous intéresse ici, ce sont les extensions pour aider à réaliser des applications en ligne professionnelles.
Liste de plugins
Pour donner une touche plus professionnelle à vos formulaires sans passer trop de temps à manipuler les feuilles de style. Ne serait-ce qu'un simple formulaire d'enregistrement... Exemple ci-dessous.
C'est un ensemble de plugins qui facilitent l'interaction entre l'utilisateur et l'application. Cela inclut un calendrier qui s'affiche quand on doit donner une date, des objets de formulaire, des fonctions d'interface utilisateur comme le glisser-déposer, et quantité d'autres.
Certaines fonctions sont maintenant fournies par HTML 5 mais pas sur tous les navigateurs. Le colorpicker utilise Canvas, donc HTML 5 reste indispensable, mais l'implémentation de canvas est plus large que celle d'autres fonctions.
Pour choisir une date et remplir un champ d'entrée à partir d'un calendrier.
Il existe plusieurs bibliothèques de tracés de graphes pour jQuery, en ligne, en barre ou en parts de tarte. J'ai essayé Flot en production et j'apprécie les possibilités que l'on a de personnaliser tous les aspects du graphe. Il est assez simple d'emploi.
Il n'est pas sans inconvénient pour autant. L'utilisation de dates comme séries de données est inutilement compliquée, bien que ce soit d'un usage plutôt courant.
On trouvera une alternative à Flot avec Flotr2 qui supprime la dépendance à jQuery et fournit un code plus léger.
Pour créer des graphiques composés de fiches reliées par des tuyaux, comme le montre l'image... Il existe une version pour Mootool et YUI.
Script qui facilite l'insertion de cartes de Google Maps dans une application web, pour l'associer à une adresse.
Il faut disposer d'une clé pour accéder au service Maps, et on doit insérer aussi le script de Google.
Cet outil sert surtout à faciliter l'emploi et personnaliser l'affichage.
Widgets
Et pour compléter une interface graphique, quelques widgets...
- Digg header. Menu dynamique.
- Score avec étoiles. On permet aux visiteurs de voter en transformant des boutons radios en étoiles. Noter qu'il n'y a pas de backend, il faut ajouter une code pour vérifier qu'une personne ne vote pas plusieurs fois.
- Icon Dock. Un menu de sélection par icones similaire au dock d'Apple. CSS Dock peut faire quelque chose de similaire en CSS 3 s'il est supporté par le navigateur.
- QuickSand. Dans le même esprit, menu par icône en plein écran avec transitions.
- MarkItUp. Transforme une simple balise <textarea> en éditeur de texte, avec icônes, fonctions HTML, ...
- Canvas Loader. A défaut de barre de progression, affiche une animation pour signaler une action en cours.
- Farbtastic Color Picker. Un widget intéressant, mais avec seulement des démos pour placer le widget dans une page, aucune sur son utilisation.
- Détection de visage. Un plugin JavaScript pour la reconnaissance faciale basé sur l'algorithme de Liu Liu.
On dispose aussi de nombreux widgets qui ne nécessitent pas jQuery, et peuvent fonctionner avec lui.
Voir aussi
- Les nouveaux attributs de HTML 5. HTML 5 offre des outils de formulaire évolués, mais la compatibilité reste encore à venir comme le montrent les tests d'implémentation.
- Widgets Canvas.
Documentation
| Tweet |
|
|