懸停在標簽上時顯示信息

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也有它自己的版本的工具提示

Answer 2

還建議您在hint.css上查看 -純CSS提示庫

Answer 3

這可能會有所幫助。 您可以在HTML的任何標記中的CSS或標題的幫助下完成此操作。

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