当鼠标悬停在表格标题上时,工具提示宽度将被隐藏

tooltip width is hidden when mouse over on table header

本文关键字:工具提示 隐藏 悬停 鼠标 表格 标题      更新时间:2023-09-26

我有一个场景可以在鼠标悬停时显示工具提示,它运行良好,但在表头隐藏了工具提示宽度。下面的代码导致了这个问题,但我不应该删除那个代码,请建议如何增强编写的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文件中删除了上面提到的代码,工具提示可以正常工作,但我不应该删除那个代码。谢谢

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

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

如果有帮助,可以试试这个:http://goo.gl/mDN4CR

您也可以通过JS 更改工具提示文本