鼠标悬停时的小屏幕弹出窗口答案

【问题标题】：mini-screen popups on mouse over鼠标悬停时的小屏幕弹出窗口
【发布时间】：2010-11-02 22:19:23
【问题描述】：

老实说，我不知道该如何表达这个问题。：/

但我正在尝试获得以下效果：

我想知道这里是否有人可以帮助我尝试弄清楚如何实现如图所示的效果？：/

效果，如图所示，当我将鼠标悬停在图像上时，或者我将“onmouseover”事件绑定到的任何内容上时，都会显示一个“弹出窗口”，其中显示我可能需要显示的文本和其他信息。

提前致谢！
-扎克

附：抱歉，示例来自 WoW；这是我试图描述这种效果时唯一能想到的。

【问题讨论】：

【解决方案1】：

查看众多 jQuery 工具提示插件中的任何一个。

qTip 好像还不错。

【讨论】：

【解决方案2】：

这里有一些伪代码可以帮助您入门：

将鼠标悬停事件绑定到链接 - 在 jquery 中：$('a.popup').mouseover(function(){ /* code here */ });

在事件中找到鼠标的位置
创建（或使用已创建的）div 来保存您的信息
将 div 直接放入 body 元素中，这样您就可以绝对定位它
使用您之前找到的鼠标位置将您的 div 定位在鼠标上（或相对于鼠标）

将鼠标移出事件绑定到链接
在事件中隐藏绝对定位的信息 div

在样式表中应用漂亮的样式:)

这就是它的全部内容。这并不难 - 如果您使用的是 jquery，所有这些内容都在文档中。

希望对你有帮助

【讨论】：

【解决方案3】：

MooTools 也有一些不错的鼠标提示：

【讨论】：