Javascript jQuery的工具提示问题
我有一个表,其中一些相邻的单元格具有相同的类someClass。我想在鼠标悬停其中一个单元格时显示工具提示。下面是我如何实现这一点的:Javascript jQuery的工具提示问题,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我有一个表,其中一些相邻的单元格具有相同的类someClass。我想在鼠标悬停其中一个单元格时显示工具提示。下面是我如何实现这一点的: /* HTML code */ <div id="tooltip"><div> /* CSS code */ #tooltip { display: none; position: absolute; border: 1px solid #333; background: #f7f5d1; p
/* HTML code */
<div id="tooltip"><div>
/* CSS code */
#tooltip {
display: none;
position: absolute;
border: 1px solid #333;
background: #f7f5d1;
padding: 2px 5px;
color: #333;
font-size: 20px;
}
/* jQuery code */
$(".someClass").hover(function(e) {
$("#tooltip").html("Shalom")
.css("top", (e.pageY - 10) + "px")
.css("left", (e.pageX + 20) + "px")
.fadeIn("fast");
},
function() {
$("#tooltip").html("").hide();
});
$(".someClass").mousemove(function(e) {
$("#tooltip").css("top", (e.pageY - 10) + "px")
.css("left", (e.pageX + 20) + "px");
});
问题是当鼠标离开一个单元格并进入相邻的单元格时,工具提示消失并再次出现,这看起来不太好
如何防止工具提示消失并再次出现
谢谢 未测试的代码被剪断,需要通过工具提示id标识工具提示
var some_object = {
about_to_be_closed: false,
close_unless_needed: function() {
if (some_object.about_to_be_closed) {
$(some_object.about_to_be_closed).fadeOut();
}
}
};
// code to be executed on close
some_object.about_to_be_closed = tooltip_id;
window.setTimeout(close_unless_needed, 100)
// code to be executed on open
if (some_object.about_to_be_closed == tooltip_id) {
some_object.about_to_be_closed = false;
}
这不是一个真正可靠的解决方案,但我相信它可以奏效