jQuery UI garde l’info-bulle ouverte pour le débogage (pour le styler) - jquery, jquery-ui, jquery-ui-tooltip

J'essaie de styliser l'info-bulle jQuery UI mais elle continue de se fermer. J'ai essayé ce qui suit sans succès:

 $("td label").tooltip({

disabled: true,
close: function (event, ui) { return false; }

}).on("click", function () {

$(this).tooltip("open");
}).off("focusout mouseleave mouseenter");

Rien ne semble le garder ouvert. Lorsque je clique dessus avec le bouton droit pour accéder à Firebug, il disparaît avant que j'aie une chance.

Réponses:

17 pour la réponse № 1

Appelez la méthode ouverte sur vos info-bulles, ce qui les fera rester ouvertes

$("td label").tooltip().tooltip("open");

---

13 pour la réponse № 2

Si c'est uniquement dans le but de déboguer, pourquoi ne pas utiliser la hide option et définir une très longue durée.

$("td label").tooltip({ hide: {duration: 1000000 } });

---

11 pour la réponse № 3

Une bien meilleure option consiste à suspendre l'exécution de js.

1. Ouvrir la console
2. Passer à l'onglet Sources
3. Survolez quelque chose pour que l'infobulle apparaisse
4. Cliquez sur le bouton F8 (peut-être différent, passez la souris sur l'icône Pause pour vérifier le raccourci clavier)

---

1 pour la réponse № 4

Les deux réponses précédentes ne m’ont pas aidéon ne fonctionnait pas sur les info-bulles non déléguées, alors qu'avec l'autre méthode, je ne pouvais pas jouer avec CSS dans le panneau de développement. en plus CSS - pour arriver à une solution avant de l'implémenter.

En fin de compte, j'ai utilisé l'instruction de débogage pour briser mon code après l'ouverture de l'info-bulle.

Exemple:

jQuery(".myElement").tooltip({
open: function (event, ui) {
debugger;
}
});

Lorsque ce point d'arrêt est atteint, évaluez-le dans la console:

$(".ui-tooltip-content")

Et puis faites un clic droit sur les résultats de l'évaluationdans la console et choisissez le panneau Révéler dans les éléments pour travailler avec lui comme n'importe quel autre élément de la page. Cela est particulièrement utile lorsque le contenu des info-bulles est construit dynamiquement (comme dans mon cas).

---

1 pour la réponse № 5

Pour la v4.1.5 de tooltipster, utilisez l'option de délai comme celle-ci.

$(".tooltip").tooltipster({
interactive:true,
animation: "grow",
delay:[100, 10000000]
});

La deuxième valeur de délai, spécifie le délai de fermeture de l'info-bulle. Référence: http://iamceege.github.io/tooltipster/#options

---