jQuery工具提示有问题吗
我正在使用找到的jQuery工具提示插件。这是它的预期行为： 有3个元素，在本例中为jQuery工具提示有问题吗,jquery,tooltip,jquery-tooltip,Jquery,Tooltip,Jquery Tooltip,我正在使用找到的jQuery工具提示插件。这是它的预期行为： 有3个元素，在本例中为divs，单击后会弹出工具提示。此工具提示是页面上通过CSS隐藏的另一个div。当它弹出时，我需要它保持可见，直到用户单击工具提示中的一个divs（或者如果不可能，则在工具提示本身内部），或者他们单击其他3个divs中的一个 问题是：当我这样做的时候，我会有一些意想不到的行为。例如，您单击的第一个div（无论单击哪一个），它都会按预期工作：除非您单击其中一个或另一个divs，否则工具提示将弹出并保持不变。但是，当
divdivdivdivdivdivdiv<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en' dir='ltr'>
<head>
<title>Tool Tip Demo</title>
<link rel='stylesheet' type='text/css' href='style/style.css' />
<script type='text/javascript' src='jquery.js'></script>
<script type='text/javascript' src='jquery.tools.min.js'></script>
<style>
.box2 {
display: inline-block;
margin: 5px;
padding: 3px;
width: 64px;
height: 64px;
line-height: 64px;
background-color: green;
text-align: center;
}
#tooltip {
display: none;
width: 300px;
height: 150px;
overflow: auto;
background-color: pink;
}
</style>
</head>
<body>
<h1>Tool Tip Demo</h1>
<script language='javascript' type='text/javascript'>
$(document).ready(function () {
$('.tooltip').tooltip({
events: {
def: "click, mouseout",
tooltip: "mouseenter, click"
},
tip: '#tooltip'}).dynamic({ bottom: { direction: 'down'} });
});
</script>
<div style='padding: 1em; width: 450px; margin: 0 auto;'>
<div class='tooltip box2'>
Div
</div>
<div class='tooltip box2'>
Div
</div>
<div class='tooltip box2'>
Div
</div>
</div>
<div id='tooltip'>
<div class='box2'>
Div
</div>
<div class='box2'>
Div
</div>
<div class='box2'>
Div
</div>
<div class='box2'>
Div
</div>
<div class='box2'>
Div
</div>
<div class='box2'>
Div
</div>
<div class='box2'>
Div
</div>
<div class='box2'>
Div
</div>
<div class='box2'>
Div
</div>
</div>
</body>
</html>
工具提示演示
.box2{
显示：内联块；
保证金：5px；
填充：3倍；
宽度：64px；
高度：64px；
线高：64px；
背景颜色：绿色；
文本对齐：居中；
}
#工具提示{
显示：无；
宽度：300px；
高度：150像素；
溢出：自动；
背景颜色：粉红色；
}
工具提示演示
$（文档）.ready（函数（）{
$（'.tooltip'）。工具提示（{
事件：{
def：“点击，鼠标离开”，
工具提示：“鼠标指针，单击”
},
提示：'#工具提示'}）.dynamic（{bottom:{direction:{down'}）；
});
Div
Div
Div
Div
Div
Div
Div
Div
Div
Div
Div
Div