Question

我有一个方案来显示鼠标悬停的工具提示，它工作正常，但在表格标题处隐藏了工具提示宽度。下面的代码导致问题，但我不应删除该代码，请建议如何增强编写的CSS代码，使工具提示完全显示。完整的工作样本，代码为：http://jsfiddle.net/8WKTj/41/

$(document).ready(function () {
    gridviewScroll();
}); 

function gridviewScroll() {
    gridView1 = $('#GridView1').gridviewScroll({
                    width: 1545,
                    height: 500,
                    railcolor: "#F0F0F0",
                    barcolor: "#CDCDCD",
                    barhovercolor: "#606060",
                    freezesize: 3, // no of columns to lock on the left
                    arrowsize: 30,
                    headerrowcount: 1,
                    railsize: 16,
                    barsize: 8
                });
}

PS：如果我从我的jsp文件中删除上面提到的代码，工具提示工作正常，但我不应该删除该代码。谢谢。

Answer 1

在函数调用之前初始化悬停效果。请参阅JSFIDDLE

$(document).ready(function () {
$("span.question").hover(function () {
    $(this).append('<div class="tooltip"><p>Text goes here....</p></div>');
  }, function () {
    $("div.tooltip").remove();
  });    
gridviewScroll();
});

Answer 2

如果有帮助，请尝试此操作：http://goo.gl/mDN4CR

您还可以通过JS

更改工具提示文本

当鼠标悬停在表头上时隐藏工具提示宽度

2 个答案: