Question

我有一个简单的html多行工具提示实现：

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");
});
};

它在页面上完美运行，但不会在jquery.ui.dialog上显示任何内容。有办法解决这个问题吗？

Answer 1

你的工具提示div必须具有比jquery ui div模态对话框更大的z-index css属性。

Answer 2

c0mrade是对的。 jQuery的对话框使用z-index = 1000作为默认值，但我没有在你的代码中看到任何z-index操作。所以最简单的方法是设置你自己的对话框的z-index值＆gt; 1000.

Answer 3

你尝试过.prepend到身体而不是.append？（如上所述的z指数）

jquery工具提示对话框

3 个答案: