jBar est une combinaison d’instructions jQuery permettant de créer des barres call to action qui permettent d’ajouter une zone d’information cachée par défaut (ou pas) avec un ruban incitant l’utilisateur à cliquer dessus pour afficher le contenu de cette dernière.

jbar-barre-call-to-action-jquery

Cette pratique est intéressante pour ajouter des infos sans détourner de prime abord l’attention de vos visiteurs de votre contenu principal. On peut par exemple y afficher le lien vers le téléchargement de la ressource, ou encore les dernières actus sur la mise à jour de votre service …

De base le plugin affiche le ruban en haut à droite (après le load de la page) et cache le contenu. Vous pouvez replier à tout moment la barre en cliquant sur la flèche montante.

Coté utilisation, c’est simple, et ça tient en 7 lignes de code jQuery:

$('.jBar').delay(2000).slideUp(function() { $('.jRibbon').show().removeClass('up', 300); }); $('.jTrigger').click(function(){ $('.jRibbon').toggleClass('up', 300); $('.jBar').slideToggle(); });

Vous l’aurez constaté, il ne s’agit pas vraiment d’un plugin à proprement parlé mais plutôt d’une combinaison simple d’instructions jQuery. C’est léger et fonctionnel ! C’est plutôt l’aspect pratique qui est intéressant, plus que la technique qui est relativement basique.

Source