2011-04-01 82 views
0

当鼠标悬停在每个Stack Overflow标签上时,它自身下方会显示一个信息框。只要鼠标悬停在标签上或通过信息框,它就会继续显示。将鼠标移出标记或信息框会导致信息框消失。Stack Overflow标记 - 它们如何在鼠标上显示信息?

如何使用JQuery或JS实现此目的?请解释从服务器检索标签信息的过程。

更新:

重要的事情是很难相信,这是一个提示。因为当标签从表面丢失鼠标指针时,工具提示通常会消失。但是至于堆栈溢出工具提示,即使鼠标移过信息区域,它们仍然保持不变。这就是为什么我提出这个问题来澄清这个问题。这种类型的定制如何完成?

回答

0

我会推荐Tooltip这样的东西。

1

没有更具体的我可以给你的是它是如何工作的一般想法。

鼠标悬停将触发一个AJAX请求(可能在短暂的计时器倒数后,为了保持它发射,直到指针已经在标签上一段时间),它向SO数据库查询有关标签。如果返回某种响应,可以是直接注入到DOM中的HTML片段,也可以是用于填充注入到DOM中的元素的XML或JSON编码数据块。 mouseout事件将从DOM中移除元素。我可以想象,AJAX响应也由JavaScript管理,并保存在内存缓存中,以便不重复请求相同的数据。

0

添加事件侦听到鼠标悬停DOM事件来显示信息框。向mouseout事件添加事件侦听器以隐藏信息框。详情请参阅Mouse event types。通过XMLHttpRequest检索您要在信息框中显示的信息。

相关问题