jNotify – Plugin jQuery – La notification à portée de clic

Aujourd’hui, un plugin jQuery qui se veut simple, mais pratique. En effet, vous avez toujours besoin sur vos sites internet dynamiques de notifier des éléments à vos utilisateurs. Par exemple, « Enregistrement effectué« , « Image correctement téléchargée » ou même « Désolé, cette action est impossible« .

warning jQuery

Pour se faire on utilise des boites de dialogue qui annoncent ce genre de message. jNotify, va vous permettre de faire ça très simplement et rapidement, avec diverses options comme le délais d’affichage, une action de fermeture etc…

Vous pouvez vous procurer le plugin via ce lien (.zip) et l’utiliser ainsi :

Appel des librairies

[pastacode lang= »markup » manual= »%3C!—%2F%2F%20load%20the%20jNotify%20CSS%20stylesheet%20%2F%2F—%3E%0A%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22js%2Fjquery.min.js%22%3E%3C%2Fscript%3E%0A%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22js%2Fjquery.jnotify.js%22%3E%3C%2Fscript%3E » message= » » highlight= » » provider= »manual »/]

Puis l’utiliser ainsi :

[pastacode lang= »javascript » manual= »%24.jnotify(%22Notification%20par%20d%C3%A9faut.%22)%3B » message= » » highlight= » » provider= »manual »/]

Bien entendu, y mettre dans une action de clic ou autre pour faire apparaitre la notification.
Par exemple :

[pastacode lang= »javascript » manual= »%24(%22%23notify%22).click(function%20()%20%7B%0A%24.jnotify(%22hello%20World%22)%3B%0A%7D)%3B » message= » » highlight= » » provider= »manual »/]

Quand vous cliquerez sur l’élément avec l’id #notify, vous allez avoir une notification par défaut disant : « Hello World ».

Évidemment, il existe plusieurs options et syntaxes, que l’on peut utiliser ainsi :

[pastacode lang= »javascript » manual= »%24.jnotify(message%2C%20%5Boptions%5D)%3B%0A%24.jnotify(message%2C%20delay)%3B%0A%24.jnotify(message%2C%20sticky)%3B%0A%24.jnotify(message%2C%20type%2C%20%5Bdelay%2Fsticky%5D)%3B » message= » » highlight= » » provider= »manual »/]

Pour toutes les options et plus d’exemples, je vous laisse vous rendre sur le site du plugin : http://www.givainc.com/labs/jnotify_jquery_plugin.htm

Articles qui peuvent vous intéresser :

Author: Franck Pertegas

Share This Post On

Submit a Comment

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *