Tooltipster是一個(gè)輕量級(jí)的jQuery工具提示插件，可以快速的幫助你生成漂亮的工具提示。
1，加載jQuery和包括Tooltipster的插件文件
在您下載Tooltipster，移動(dòng)tooltipster.css和jquery.tooltipster.min.js到根的CSS和JavaScript的目錄。接下來(lái)，加載jQuery和包括您的標(biāo)簽里面Tooltipster的CSS和JavaScript文件：
<head> ... <link rel="stylesheet" type="text/css" href="css/tooltipster.css" /> <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.0.min.js"></script> <script type="text/javascript" src="js/jquery.tooltipster.min.js"></script> ... </head>
2，設(shè)置你的HTML
為了Tooltipster工作，我們首先需要添加.tooltip類（或任何類別/選擇意味著你想使用）的任何元素，我們希望有一個(gè)工具提示。接下來(lái)，我們將設(shè)置標(biāo)題屬性，無(wú)論我們希望我們的提示說(shuō)。下面是一些例子：
添加工具提示的圖像：
添加工具提示已經(jīng)有一個(gè)類的鏈接：
添加工具提示一個(gè)div：
3，激活Tooltipster
我們要做的最后一件事就是激活插件。要做到這一點(diǎn)，你的結(jié)束</ head>前才添加下面的腳本標(biāo)簽（使用任何選擇你想 - 在這種情況下，我們使用的是.tooltip類）：
<head> ... <script> $(document).ready(function() { $('.tooltip').tooltipster(); }); </script> </head> 總結(jié)：
1.工具提示支持HTML標(biāo)簽內(nèi)容
2.輕量級(jí)
3.靈活高效
4.樣式定義簡(jiǎn)單，100%的CSS
5.支持3種主題
6.支持firefox，Chrome，IE7/8/9，Opera，Safari
以上所述就是本文的全部?jī)?nèi)容了，希望大家能夠喜歡。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注
