新聞中心
tooltip或者infotip或者h(yuǎn)int,是一種常見(jiàn)的圖形用戶界面元素。它用于連同一個(gè)光標(biāo),通常是一個(gè)鼠標(biāo)光標(biāo)。當(dāng)用戶將鼠標(biāo)懸停在一個(gè)特定的地方,無(wú)需點(diǎn)擊,就會(huì)出現(xiàn)一個(gè)包含關(guān)于懸停到這個(gè)地方的一些信息的tooltip或小的懸浮框。

創(chuàng)新互聯(lián)公司是一家專業(yè)提供榆林企業(yè)網(wǎng)站建設(shè),專注與做網(wǎng)站、成都做網(wǎng)站、H5網(wǎng)站設(shè)計(jì)、小程序制作等業(yè)務(wù)。10年已為榆林眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站建設(shè)公司優(yōu)惠進(jìn)行中。
jQuery tooltip是應(yīng)該考慮在網(wǎng)頁(yè)設(shè)計(jì)和開(kāi)發(fā)中利用的***的構(gòu)件之一。Tooltip提供了額外的功能和通用型,可以被視為大多數(shù)網(wǎng)站的最重要的一個(gè)用戶界面組件。
本文中我收集了15個(gè)***的jquery tooltip插件,這些可以幫助你創(chuàng)建創(chuàng)新的和有創(chuàng)造性的網(wǎng)頁(yè)設(shè)計(jì),同時(shí)也可以幫助你來(lái)實(shí)現(xiàn)你的web項(xiàng)目所需要的結(jié)果。我希望這個(gè)jquery tooltip插件的列表對(duì)你即將到來(lái)或已經(jīng)開(kāi)始的web項(xiàng)目提供了便利并且是確實(shí)有用的。如果你知道一些其他的jquery tooltip插件請(qǐng)通過(guò)在評(píng)論區(qū)跟帖讓我知道,非常期待。請(qǐng)享受本文!
1. Tooltipster
Tooltipster是一個(gè)jQuery插件,用來(lái)快速創(chuàng)建HTML5驗(yàn)證的靈活的提示工具。這個(gè)插件很小(4.8kb大?。?,工作很快并且可以很容易的被定制。外觀可以隨意改變CSS(支持主題)和鼠標(biāo)箭頭的位置,展現(xiàn)的延遲/時(shí)間都可以被定義。
Source
2. Toolbar.js
Toolbar.js允許你快速創(chuàng)建用于web應(yīng)用程序和網(wǎng)站的提供工具類(lèi)型的工具欄。這個(gè)工具欄可以很容易的用twitter啟動(dòng)圖標(biāo)定制,還提供自適應(yīng)的環(huán)繞在工具欄周?chē)@示一些圖標(biāo)。
Source
3.qTip2
qTip2是第二代先進(jìn)的qTip插件,這是一個(gè)曾經(jīng)很流行的jQuery框架。在1.0版本的友好的用戶和豐富的功能的基礎(chǔ)上,qTip2提供了一些增強(qiáng)的功能,比如氣泡提示、影像映射等等。它是完全免費(fèi)的,許可是MIT/GPLv2。
Source
4. Poshy Tip jQuery Plugin
Poshy Tip jQuery Plugin是一個(gè)提示框插件,允許輕松創(chuàng)建時(shí)尚的提示框。通過(guò)Poshy Tip你可以把提示相對(duì)于鼠標(biāo)光標(biāo)或目標(biāo)元素來(lái)定位,并可以將它們橫向或縱向展示。
Source
5. Grumble.js
Grumble.js提供了一個(gè)沒(méi)有東西南北定位限制的特殊的提示框。它可以從360度的任何角度環(huán)繞一個(gè)給定的元素,可以指定任意的距離。
Source
6. Joyride
Joyride是一個(gè)jQuery的插件,簡(jiǎn)化了指導(dǎo)用戶發(fā)現(xiàn)一個(gè)網(wǎng)站的特點(diǎn)的過(guò)程。通過(guò)定義一個(gè)有序的步驟,可以在任何HTML元素附近通過(guò)提示框顯示需要的信息。
Source
#p#
7. ImageMapster
ImageMapster是一個(gè)可以通過(guò)添加更多地功能給舊圖片來(lái)讓它們更有生氣的jQuery插件。使用這個(gè)插件,可以通過(guò)各種方式突出顯示、選擇(單個(gè)或多個(gè)區(qū)域)和操縱任何的圖像。提示工具可以顯示用戶友好的可以與該圖像互動(dòng)的信息。
Source
8. Tooltipsy
Tooltipsy是一個(gè)提供了創(chuàng)建提示工具的靈活基礎(chǔ)的jQuery插件。它有最小的默認(rèn)樣式或動(dòng)畫(huà),你都可以完全控制它們。它可以按你希望的方式來(lái)定位,外觀和感覺(jué)均可以通過(guò)CSS來(lái)定制,任何類(lèi)型的動(dòng)畫(huà)都可以被實(shí)現(xiàn)。
Source
9. jQuery Bubble Popup
jQuery Bubble Popup是一個(gè)用來(lái)幫助創(chuàng)建容易控制的別致Tooltip的***的JS框架的插件。Tooltip通過(guò)淡入淡出的方式顯示/隱藏,里面也可以顯示任何 的HTML內(nèi)容。它們可以附加到任何一邊的一個(gè)元素中,也可以獲取Tooltip的狀態(tài)(開(kāi)/關(guān),創(chuàng)建,***一次修改或***一次顯示的時(shí)期時(shí)間)而采取相 應(yīng)的動(dòng)作。
Source
10. Beauty Tips
BeautyTips是一個(gè)使用canvas元素來(lái)實(shí)時(shí)繪制Tooltip的jQuery插件。每一個(gè)Tooltip默認(rèn)顯示在一個(gè)元素的有足夠空間的一邊,但是這個(gè)位置也可以強(qiáng)制放到一邊。內(nèi)容可以硬編碼進(jìn)去,或者從一個(gè)屬性獲取或者通過(guò)一次Ajax請(qǐng)求獲取。
Source
11. Simpletip
Simpletip是一個(gè)新生的輕量級(jí)的創(chuàng)建靈活的Tooltip的jQuery插件。Tooltip可以附加到任何的元素 & 輕松風(fēng)格的演示 & 定位。Tooltip可以是靜態(tài)的、動(dòng)態(tài)的或者通過(guò)Ajax加載的。另外,可以應(yīng)用任何組合的效果來(lái)使它們更有吸引力。
Source
#p#
12. Colortip
它將在你頁(yè)面中元素的title屬性轉(zhuǎn)換為一系列豐富多彩的Tooltip。共有六個(gè)可用的顏色主題,所以你可以很容易的匹配你的設(shè)計(jì)。你也可以輕松 地通過(guò)添加三個(gè)額外的樣式類(lèi)到你的stylesheet和在colortip-1.0-jquery.js中的支持顏色數(shù)組中添加一個(gè)元素來(lái)創(chuàng)建你自己的 Tooltip。
Source
13.TipTip
TipTip是一個(gè)非常輕量級(jí)和智能的自定義Tooltip的jQuery插件。它使用零圖像,并且是通過(guò)CSS完全可定制的。TipTip會(huì)檢測(cè)瀏 覽器窗口的邊緣以確保tooltip停留在當(dāng)前窗口的大小。因此Tooltip將調(diào)整自身來(lái)顯示在要使用TipTip的元素的上下左右,這取決于要保持在 瀏覽器窗口中的哪些是必要的。
Source
14. (Mb) Tooltip
(mb)Tooltip是為你的使用jQuery的頁(yè)面提供的一個(gè)美麗的tooltip。只需很簡(jiǎn)單的將你的內(nèi)容作為title屬性的值,然后你就可 以用這個(gè)聰明的漂亮的tooltip代替那丑陋的默認(rèn)tooltip了。你也可以隨時(shí)禁用或啟用(mb)Tooltip。
Source
15. Hovercard
這是一個(gè)免費(fèi)的輕量級(jí)jQuery插件,可以讓你使用懸停的label、link或任何你選擇的html元素來(lái)顯示相關(guān)聯(lián)的信息。hovercard 可以用在顯示個(gè)人簡(jiǎn)歷、書(shū)籍作者和價(jià)格,通過(guò)Ajax加載相關(guān)聯(lián)的信息,直接編輯等場(chǎng)景下。你也可以添加你的自定義數(shù)據(jù)源,使用已有的card格式來(lái)顯示 分析的數(shù)據(jù)。
Source
原文鏈接:http://www.admin10000.com/document/2332.html
分享文章:15款Tooltip工具提示jQuery插件
文章路徑:http://m.fisionsoft.com.cn/article/ccsdhpp.html


咨詢
建站咨詢
