将鼠标悬停在标签上时显示信息

Question

我正在实现一个功能，当您将鼠标悬停在 link 上时，它会显示 工具提示 。

这是一个例子：

有没有其他javascript库实现了这个功能？（最好和图片一样）

Answer 1

如果您正在使用 Bootstrap you have Popover.js 可用

    //JS
    $(function () {
        $('[data-toggle="popover"]').popover()
    })

    //HTML
    <button type="button" class="btn btn-lg btn-danger" data-toggle="popover" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?">
        Click to toggle popover
    </button>

您也可以将 Popover 的 trigger 值更改为 hover。

Bootstrap 的第二个选项是 Tooltip，尽管它看起来不像您的示例。

jQuery UI 也有自己的 Tooltip

版本

Answer 2

也推荐大家去hint.css上看看-纯css提示库

Answer 3

这可能会有所帮助。您可以借助 css 或 HTML.

中任何标签中的标题来完成此操作

http://webdesign.tutsplus.com/articles/quick-tip-tooltips-courtesy-of-html5-data-attributes--webdesign-4826

将鼠标悬停在标签上时显示信息

Show info when hovering over a tag

javascript

jquery

hover