JQuery Tooltip über Dialog
-
20-09-2019 - |
Frage
Ich habe eine einfache HTML -Multiline -Tooltip -Implementierung:
this.tooltip = function(tag)
{
xOffset = 10;
yOffset = 20;
$(tag + ".tooltip").hover(function(e){
this.t = this.title;
this.title = "";
$("body").append("<p id='tooltip'>"+ this.t +"</p>");
$("#tooltip")
.css("top",(e.pageY - xOffset) + "px")
.css("left",(e.pageX + yOffset) + "px")
.fadeIn("fast");
},
function(){
this.title = this.t;
$("#tooltip").remove();
});
$(tag + ".tooltip").mousemove(function(e){
$("#tooltip")
.css("top",(e.pageY - xOffset) + "px")
.css("left",(e.pageX + yOffset) + "px");
});
};
Es funktioniert perfekt auf einer Seite, zeigt jedoch nichts über jQuery.ui.dialog an. Gibt es eine Möglichkeit, das zu beheben?
Lösung
Ihr Tooltip Div muss eine größere Z-Index-CSS-Eigenschaft haben als die des Jquery UI DIV-Modal-Dialogs.
Andere Tipps
C0Mrade ist korrekt. JQuery's Dialog mit Z-Index = 1000 standardmäßig, aber ich habe keine Z-Index-Operationen in Ihrem Code gesehen. Der einfachste Weg ist also, den Z-Index-Wert Ihres eigenen Dialogs> 1000 festzulegen.
Haben Sie versucht, den Körper anstelle von .Append vorzunehmen? (mit dem Z-Index, wie oben angegeben)
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow