Recommandations pour jQuery tooltips

Je suis à la recherche d'info-bulle des plugins pour jQuery qui permettrait ce type de comportement.

<a href="somewhere.html">
 <span>
  <img src="someimage.jpg" style="display: none;" />
  Here is the tooltip content.
 </span>
 Here is the link to somewhere.
</a>

Le comportement que j'espère, c'est de placez le curseur sur "Voici le lien de quelque part" et une info-bulle pop up affiche le contenu du span contenant "someimage.jpg" et "Voici le contenu de l'info-bulle".

Je préférerais que l'info-bulle de la piste avec la souris du mouvement sur le lien et que l'info-bulle de l'apparence (couleur de fond, l'opacité, la couleur de la bordure, etc.) être configurable.

Les deux plus populaires info-bulles que j'ai trouvé, "clueTip" et Jörn Zaefferer du "info-bulle" ne semblent pas s'adapter à la loi, à moins que quelque chose m'échappe.

En fin de compte, les liens et les images sont générées dynamiquement.

InformationsquelleAutor jerome | 2009-02-12
  1. 18

    OHHHHHHHH la plus!

    http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/

    Démos: (cherchez le Lien "yahoo" exemple pour répondre à tous vos besoins)

    http://jquery.bassistance.de/tooltip/demo/

    EDIT: je vois que vous avez mentionné Jorn (je ne sais pas son nom), mais la recherche des "yahoo" exemple, il devrait faire ce que vous voulez.

    • Je seconde rizzle de la suggestion ... la honte @jerome n'a jamais accepté votre réponse
    InformationsquelleAutor missaghi
  2. 8

    vous dire le vrai, j'ai essayé un couple d'entre eux mais je suis coller avec celui que j'aime vraiment:

    http://craigsworks.com/simpletip/sandbox/

    il y a beaucoup de choses que vous pouvez changer et ils ont l'air fantastique n'importe où! 🙂

    Recommandations pour jQuery tooltips

    (source: balexandre.com)

    Mis à jour

    Comme pbz dit, ce n'est plus disponible pour le droit d'auteur infrangiments, mais la même chose peut être trouvé dans l '"original" développeur à

    http://www.nickstakenburg.com/projects/prototip2/

    • Le site ne fonctionne plus et que le composant n'est plus disponible.
    • Une réponse avec plus de 1 an et demie ... aimerais savoir pourquoi downvote!
    InformationsquelleAutor balexandre
  3. 5

    Je suis un grand fan de BeautyTips

    InformationsquelleAutor Paolo Bergantino
  4. 4

    - T-il de jquery? Vous pouvez le faire avec juste CSS si vous le souhaitez.

    a.info
{
    position: relative;
    z-index: 24;
}

a.info:hover
{
    z-index: 25;    
}

a.info span
{
    display: none;
}

a.info:hover span
{
    display: block;
    position: absolute;
    top: 2em;
    left: 2em;
    width: 15em;
    padding: 6px;
    border: 1px solid black;
    background-color: #eeeeee;
    color: #000;
}

    Alors vous pouvez l'utiliser comme vous l'avez.

    <a href="somewhere.html" class="info">
 <span>
  <img src="images/someImage.jpg" />
  Here is the tooltip content.
 </span>
 Here is the link to somewhere.
</a>

    MODIFIER

    La lecture de ma dose quotidienne de blogs cet article est venu à mon attention. Ils créent un plugin jquery qui fait ce que vous voulez, apparaît une image avec les options de style et de mouvement de la souris. Découvrez le résultat ici.

    http://james.padolsey.com/demos/imgPreview/full/

    Vous devriez être en mesure de suivre le tutoriel et écrire le plugin ou téléchargez l'exemple de plugin.

    • La droite. En fait, nous utilisons quelque chose de similaire sur le site que j'ai actuellement pour développer. J'ai été intéressé par la possibilité d'avoir l'info-bulle de la piste de la souris les mouvements. Merci.
    • Hm. Ce qui ne fonctionne pas correctement sous IE6.
    • Découvrez mon montage, je pense que cela pourrait être juste ce que vous cherchez.
    InformationsquelleAutor Jab
  5. 2

    Cela devrait vous permettre de mettre ce que vous voulez dans la zone info-bulle.

    http://code.google.com/p/next-msg/

    Plus il a des thèmes
    Recommandations pour jQuery tooltips

    InformationsquelleAutor Donny V.
  6. 2

    qTip - aucun doute à ce sujet

    Voir ici, trop

    InformationsquelleAutor Bruiser
  7. 1

    Vous pouvez également essayer un outil appelé Likno Web info-bulles Constructeur:
    http://www.likno.com/jquery-tooltips/index.php

    InformationsquelleAutor Brianna Smith
  9. 1

    Voici un jQuery tooltip qui peuvent faire à peu près n'importe quoi, ressemble beaucoup trop:

    À bout: http://projects.nickstakenburg.com/tipped

    InformationsquelleAutor cuuri
  10. 1

    C'est un grand celui que j'utilise, il a une position et de la souris options de suivi, est également livré avec un tas de thèmes de la boîte. http://www.websanova.com/plugins/websanova/tooltip

    InformationsquelleAutor Rob
  11. 0

    ive pensé à utiliser ce:
    http://www.codylindley.com/blogstuff/js/jtip/

    et ce:
    http://onehackoranother.com/projects/jquery/tipsy/

    celles recommandées peut répondre à vos besoins mieux

    InformationsquelleAutor mkoryak
  12. 0

    Je recommande ClueTip: http://plugins.learningjquery.com/cluetip/ Il est facile à utiliser, prend en charge les sauts de ligne dans les info-bulles (avec un librement configurable séparateur) et semble bien fonctionner à l'intérieur des cellules de tableau (ce qui n'était pas le cas avec http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/).

    InformationsquelleAutor simon
  13. 0

    jQuery UI ont maintenant intégré dans le module info-bulle : http://jqueryui.com/tooltip/

    Fonctionne bien et est facilement personnalisable.

    InformationsquelleAutor magnetik
  14. 0

    J'ai aussi construit un plugin jQuery pour les info-bulles - il est vraiment petit - 5KB compacte, très facile à configurer et à utiliser, et avec beaucoup d'options de configuration, il va positionner les pointes à l'intérieur de la fenêtre d'affichage quel que soit verticale/horizontale de défilement, ou la taille de la fenêtre; la Largeur et la couleur d'arrière-plan peut être modifié au moment de l'initialisation. Il a utilisé aucune des images que ce soit, il utilise le CSS pour tous les trucs de fantaisie et dégrade gracieusement pour les anciens navigateurs. Il fonctionne même dans IE6 🙂 Et, par défaut, il ressemble à ceci:

    Recommandations pour jQuery tooltips

    InformationsquelleAutor Stefan Gabos
  15. 0

    NewTip -->

          New Tooltip JQuery plugin with support in browsers from IE7+, Firefox, Chrome

    Très Attrayant et facile à personnaliser pour les deux événements de la manipulation des rappels et pour n'importe quel type d'élément.

    faire un essai :

    Plugin JQuery De Registre : http://plugins.jquery.com/newtip/

    Github Page D'Accueil : https://github.com/chandra7mca/newtip

    InformationsquelleAutor chandra7mca