15 款Tooltip工具提示jQuery插件分別是什么

今天就跟大家聊聊有關15 款Tooltip工具提示jQuery插件分別是什么，可能很多人都不太了解，為了讓大家更加了解，小編給大家總結了以下內容，希望大家根據這篇文章可以有所收獲。

tooltip或者infotip或者hint，是一種常見的圖形用戶界面元素。它用于連同一個光標，通常是一個鼠標光標。當用戶將鼠標懸停在一個特定的地方，無需點擊，就會出現一個包含關于懸停到這個地方的一些信息的tooltip或小的懸浮框。

jQuery tooltip是應該考慮在網頁設計和開發中利用的構件之一。Tooltip提供了額外的功能和通用型，可以被視為大多數網站的最重要的一個用戶界面組件。

我收集了15個***的jquery  tooltip插件，這些可以幫助你創建創新的和有創造性的網頁設計，同時也可以幫助你來實現你的web項目所需要的結果。我希望這個jquery  tooltip插件的列表對你即將到來或已經開始的web項目提供了便利并且是確實有用的。

1. Tooltipster

Tooltipster是一個jQuery插件，用來快速創建HTML5驗證的靈活的提示工具。這個插件很小（4.8kb大小），工作很快并且可以很容易的被定制。外觀可以隨意改變CSS（支持主題）和鼠標箭頭的位置，展現的延遲/時間都可以被定義。

Source

2. Toolbar.js

Toolbar.js允許你快速創建用于web應用程序和網站的提供工具類型的工具欄。這個工具欄可以很容易的用twitter啟動圖標定制，還提供自適應的環繞在工具欄周圍顯示一些圖標。

Source

3.qTip2

qTip2是第二代先進的qTip插件，這是一個曾經很流行的jQuery框架。在1.0版本的友好的用戶和豐富的功能的基礎上，qTip2提供了一些增強的功能，比如氣泡提示、影像映射等等。它是完全免費的，許可是MIT/GPLv2。

Source

4. Poshy Tip jQuery Plugin

Poshy Tip jQuery Plugin是一個提示框插件，允許輕松創建時尚的提示框。通過Poshy Tip你可以把提示相對于鼠標光標或目標元素來定位，并可以將它們橫向或縱向展示。

Source

5. Grumble.js

Grumble.js提供了一個沒有東西南北定位限制的特殊的提示框。它可以從360度的任何角度環繞一個給定的元素，可以指定任意的距離。

Source

6. Joyride

Joyride是一個jQuery的插件，簡化了指導用戶發現一個網站的特點的過程。通過定義一個有序的步驟，可以在任何HTML元素附近通過提示框顯示需要的信息。

Source

7. ImageMapster

ImageMapster是一個可以通過添加更多地功能給舊圖片來讓它們更有生氣的jQuery插件。使用這個插件，可以通過各種方式突出顯示、選擇（單個或多個區域）和操縱任何的圖像。提示工具可以顯示用戶友好的可以與該圖像互動的信息。

Source

8. Tooltipsy

Tooltipsy是一個提供了創建提示工具的靈活基礎的jQuery插件。它有最小的默認樣式或動畫，你都可以完全控制它們。它可以按你希望的方式來定位，外觀和感覺均可以通過CSS來定制，任何類型的動畫都可以被實現。

Source

9. jQuery Bubble Popup

jQuery Bubble  Popup是一個用來幫助創建容易控制的別致Tooltip的***的JS框架的插件。Tooltip通過淡入淡出的方式顯示/隱藏，里面也可以顯示任何 的HTML內容。它們可以附加到任何一邊的一個元素中，也可以獲取Tooltip的狀態（開/關，創建，***一次修改或***一次顯示的時期時間）而采取相 應的動作。

Source

10. Beauty Tips

BeautyTips是一個使用canvas元素來實時繪制Tooltip的jQuery插件。每一個Tooltip默認顯示在一個元素的有足夠空間的一邊，但是這個位置也可以強制放到一邊。內容可以硬編碼進去，或者從一個屬性獲取或者通過一次Ajax請求獲取。

Source

11. Simpletip

Simpletip是一個新生的輕量級的創建靈活的Tooltip的jQuery插件。Tooltip可以附加到任何的元素 & 輕松風格的演示 & 定位。Tooltip可以是靜態的、動態的或者通過Ajax加載的。另外，可以應用任何組合的效果來使它們更有吸引力。

Source

12. Colortip

它將在你頁面中元素的title屬性轉換為一系列豐富多彩的Tooltip。共有六個可用的顏色主題，所以你可以很容易的匹配你的設計。你也可以輕松 地通過添加三個額外的樣式類到你的stylesheet和在colortip-1.0-jquery.js中的支持顏色數組中添加一個元素來創建你自己的 Tooltip。

Source

13.TipTip

TipTip是一個非常輕量級和智能的自定義Tooltip的jQuery插件。它使用零圖像，并且是通過CSS完全可定制的。TipTip會檢測瀏 覽器窗口的邊緣以確保tooltip停留在當前窗口的大小。因此Tooltip將調整自身來顯示在要使用TipTip的元素的上下左右，這取決于要保持在 瀏覽器窗口中的哪些是必要的。

Source

14. (Mb) Tooltip

(mb)Tooltip是為你的使用jQuery的頁面提供的一個美麗的tooltip。只需很簡單的將你的內容作為title屬性的值，然后你就可 以用這個聰明的漂亮的tooltip代替那丑陋的默認tooltip了。你也可以隨時禁用或啟用(mb)Tooltip。

Source

15. Hovercard

這是一個免費的輕量級jQuery插件，可以讓你使用懸停的label、link或任何你選擇的html元素來顯示相關聯的信息。hovercard 可以用在顯示個人簡歷、書籍作者和價格，通過Ajax加載相關聯的信息，直接編輯等場景下。你也可以添加你的自定義數據源，使用已有的card格式來顯示 分析的數據。

看完上述內容，你們對15 款Tooltip工具提示jQuery插件分別是什么有進一步的了解嗎？如果還想了解更多知識或者相關內容，請關注億速云行業資訊頻道，感謝大家的支持。