鼠标悬停时保持工具提示打开

时间:2011-02-08 12:35:52

标签: javascript jquery tooltip

我想使用jquery创建一个简单的工具提示。当用户悬停某个链接时,旁边会出现一个带有一些动态内容的小方框。我唯一无法弄清楚的是当鼠标悬停在工具提示本身时如何保持工具提示打开?如果鼠标不在链接中,则应自动关闭工具提示,除非鼠标位于工具提示本身之外,因为工具提示中会有一些链接,用户应该能够点击它...

有人可以指出如何使用jquery来完成这项工作吗?

4 个答案:

答案 0 :(得分:2)

如果您只是想让它正常工作,请使用其中一个专用插件,例如: qtip

如果您出于某种原因想要或必须自己做,我就是这样做的 当鼠标离开链接时,您不会立即关闭工具提示,而是设置setTimout关闭处理程序。如果在0.5秒内鼠标返回工具提示或链接,则取消处理程序。为此,您可以将超时ID(由setTimeout重定)存储为与工具提示关联的jquery数据对象。

答案 1 :(得分:1)

更新:截至目前,使用jQuery UI工具提示要好得多。
网址:http://jqueryui.com/tooltip/


使用任何可用的jQuery Tooltip插件,而不是编写自己的Tooltip。

simpletip是我之前使用过的好文章。

$("jquery selector").simpletip({
   fixed: true
});

答案 2 :(得分:0)

如果链接和工具提示之间没有空格,只需让工具提示成为链接的子节点,并在链接上使用mouseenter和mouseleave事件。

答案 3 :(得分:0)

试试这个: jQuery Tooltip Plugin