Comment afficher un message d'info-bulle en survol à l'aide de jQuery?

Question

Comme le titre l'indique, comment puis-je afficher un message d'info-bulle en survol à l'aide de jQuery?

Answer 1

Le plugin Tooltip est peut-être trop lourd pour ce dont vous avez besoin. Définissez simplement l'attribut 'title' avec le texte que vous souhaitez afficher dans votre info-bulle.

 $("#yourElement").attr('title', 'This is the hover-over text');
 

Answer 2

Je suggère qTip .

Answer 3

jetez un oeil à la jQuery Tooltip plugin. Vous pouvez passer un objet d'options pour les différentes options.

Il y a aussi d'autres alternatives info-bulle plugins disponibles, dont quelques-uns sont

• Aléatoire.Next()'AJAX de jQuery tooltip

• dhtml goodies AJAX info-bulle

• clueTip

Prenez regarder les démos et de la documentation et s'il vous plaît mettre à jour votre question si vous avez des questions spécifiques sur la façon de les utiliser dans votre code.

Answer 4

Vous pouvez utiliser l' info-bulle d' amorçage. N'oubliez pas de l'initialiser.

 <span class="tooltip-r" data-placement="left" data-toggle="tooltip" data-original-title="Explanation">
inside span
</span>
 

Sera affiché le texte Explication sur le côté gauche.

et lancez-le avec js:

 $('.tooltip-r').tooltip();
 

Answer 5

Comme recommandé, qTip et d'autres projets sont assez anciens, je recommande d'utiliser qTip2 car il est le plus à jour.