堆栈溢出标签 - 他们如何在显示鼠标的信息?(Stack Overflow tags - How d

2019-10-29 06:08发布

在鼠标在每个堆栈溢出标签事件本身显示下面的信息框。 只要鼠标移动到标签或通过信息框,但它仍然是可见的。 移动鼠标退出了标记或信息框原因的信息框消失。

我怎样才能做到这一点使用JQuery或JS? 请解释从服务器检索标记信息以及进程。

更新:

最重要的是,很难相信这是一个提示。 因为当标签失去从其表面鼠标指针工具提示通常将消失。 然而,作为一个堆栈溢出提示他们仍然留即使鼠标移过信息区。 这就是为什么我提出这个问题,澄清这件事。 这种类型的自定义的是如何进行的?

Answer 1:

看一些提示插件的jQuery。 作为HTML工具提示的接收,只是看一些简单的$.ajax jQuery的文档中的例子。


提示

  • 30个时尚的jQuery的工具提示插件上口设计
  • 10个优秀的工具提示插件使用jQuery


Answer 2:

而没有更具体的我可以给你的是它是如何工作的总体思路。

鼠标悬停将触发一个AJAX请求(大概是为了短定时器倒计时后保持射击,直到指针已经过了很短的时间标记),其查询有关问题的标签SO数据库。 如果返回某种响应的,无论是将其直接注入到DOM中的HTML片段,或XML或JSON编码的数据块,其用于填充将其注入到所述DOM的元件。 mouseout事件会从DOM删除元素。 我会想象Ajax响应是由管理它使同一数据不会一再要求javascript中的内存缓存还举行。



Answer 3:

我建议的工具提示类似的东西。



Answer 4:

事件侦听器添加到鼠标悬停DOM事件来显示信息框。 事件侦听器添加到mouseout事件隐藏信息框。 见鼠标事件类型的详细信息。 检索要在通过信息框来显示信息的XMLHttpRequest 。



文章来源: Stack Overflow tags - How do they display info on mouse over?