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

Question

我正在实施一项功能，当您悬停链接时，它会显示工具提示。

以下是一个例子：

是否有其他实现此功能的javascript库？（最好与图像相同）

Answer 1

如果您使用Bootstrap，则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 - Pure css提示库

Answer 3

这可能会有所帮助。 您可以在HTML中的任何标记中使用css或title来帮助它。

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