一個(gè)插件的基本功能是執(zhí)行一個(gè)含有元素集合的函數(shù)數(shù)組。每個(gè)方法和jQuery核心組成一個(gè)插件，如.fadeOut()或.addClass()。一個(gè)jQuery插件是一個(gè)基本的可以擴(kuò)充jQuery 原型對(duì)象的方法。當(dāng)原型對(duì)象被擴(kuò)充后，jQuery所有的對(duì)象都可以繼承每一個(gè)擴(kuò)充的方法。
jQuery有強(qiáng)大的社區(qū)支持，社區(qū)里有很多技能嫻熟的開(kāi)發(fā)者夜以繼日的創(chuàng)造出令人驚嘆的腳本和網(wǎng)絡(luò)應(yīng)用。然而，這將增大了為你任務(wù)篩選插件的難度。這就是你為什么會(huì)看到此推薦，你將在這里找40個(gè)必須的jQuery插件集合，當(dāng)你應(yīng)用這些插件時(shí)，將會(huì)讓你得網(wǎng)站變得更加友好。
好好享受吧!
1.FlowType.js
FlowType.JS是一個(gè)可以自動(dòng)調(diào)整字體大小和行高(根據(jù)父類(lèi)的寬)的jQuery插件，這樣我們的內(nèi)容將呈現(xiàn)出我們喜歡的樣子。當(dāng)調(diào)整大小時(shí)，它可以設(shè)置最小/大字體，最小/大寬度。同時(shí)它對(duì)webfonts有很好的支持，下面是個(gè)展示它如何工作的例子(試著改變改變?yōu)g覽器的大小).
2.jQuery Flat Shadow
jQuery Flat Shadow是一個(gè)能夠添加陰影效果到任何目標(biāo)上的jQuery插件。它可以自定義陰影的顏色，角度，同時(shí)還可以控制陰影的開(kāi)啟和關(guān)閉狀態(tài)。
3.任意錨點(diǎn)JS
Arbitrary.Anchor.js是一個(gè)可以擴(kuò)充標(biāo)準(zhǔn)錨點(diǎn)(通過(guò)#鏈接)功能的jQuery插件。它可以讓我把目標(biāo)投向任何jQuery選擇器(如類(lèi)和元素類(lèi)型)而不僅僅局限于id。同時(shí)它對(duì)復(fù)雜的選擇器支持的也不錯(cuò)。(如http://example.com#.sup.brah-這要匹配兩個(gè)類(lèi))。點(diǎn)擊鏈接將會(huì)產(chǎn)生平滑的自動(dòng)滾動(dòng)效果。而且，這個(gè)滾動(dòng)的速度也可以在鏈接里設(shè)置(如 http://example.com#.sup.brah｜100 )
4.tidyTime.js
tidyTime.js是一個(gè)友好展示時(shí)間的jQuery插件。時(shí)間數(shù)值將被轉(zhuǎn)化為如：“9點(diǎn)過(guò)一刻”，“5點(diǎn)整”，“7點(diǎn)57”字串等等。而且，這個(gè)插件允許我們可以在時(shí)間的前邊或是后面添加自定義字串，如：“嗨，現(xiàn)在是3點(diǎn)50分，要快哦！”。也可以根據(jù)不同的時(shí)間戳指定字串，這樣當(dāng)觸發(fā)tidyTime時(shí)就會(huì)產(chǎn)生一個(gè)存在的回調(diào)。
5.Sticky-kit
Sticky-kit是一個(gè)很方便的jQuery插件，它能簡(jiǎn)單的創(chuàng)建/管理粘性元素，而且一些組合特性也能用于復(fù)雜應(yīng)用中。這些特性包括“處理多個(gè)粘性元素”，“根據(jù)元素在視圖中的位置開(kāi)啟和關(guān)閉行為”以及回調(diào)。同時(shí)它也有根據(jù)瀏覽器大小改變重新計(jì)算元素尺寸的函數(shù)。
6.Owl Carousel
Owl Carousel是一個(gè)可以讓我們快速創(chuàng)建響應(yīng)式旋轉(zhuǎn)木馬滑塊的插件。它支持觸摸和能夠展示包含任何標(biāo)簽的HTML內(nèi)容。它可以設(shè)置換頁(yè)/滑動(dòng)速度、開(kāi)啟/關(guān)閉自動(dòng)演示，展示豆子導(dǎo)航等。同時(shí)，也可以定義桌面顯示項(xiàng)目的數(shù)目，Owl Carousel可以自動(dòng)的區(qū)分平板和手機(jī)。
7.SlimMenu
SlimMenu 可以將帶有深度的非順序列表轉(zhuǎn)化為一個(gè)帶有子菜單的菜單，在小屏幕上，菜單變成下拉式導(dǎo)航。它支持觸摸和自定義選項(xiàng)如動(dòng)畫(huà)和速度。
8.Tabulous.js
Tabulous.js是一個(gè)輕量級(jí)的jQuery插件，它能用普通的HTML結(jié)構(gòu)來(lái)簡(jiǎn)單的創(chuàng)建。選項(xiàng)卡可以用CSS創(chuàng)建，同時(shí)存在開(kāi)關(guān)效果(滑動(dòng)，縮放，翻轉(zhuǎn))。它沒(méi)有復(fù)雜的特性，就只有選項(xiàng)卡，它的特效有時(shí)就是我們想要的。
9. EasyAB
這是一個(gè)快速創(chuàng)建A/B或者多元測(cè)試的jQuery（和Zepto）插件。一旦事件被觸發(fā)，他們就會(huì)被Google Analytics中的自定義變量記錄下來(lái)。easyAB可以添加任何數(shù)量的命令，同時(shí)它們可以自定義到JavaScript函數(shù)中。
10. S Gallery
S Gallery是另外一款jQuery圖片畫(huà)廊插件，它能夠在可以有響應(yīng)事件的網(wǎng)格中顯示圖片。它的靈感是來(lái)自于sony產(chǎn)品首頁(yè)的畫(huà)廊效果（sony產(chǎn)品首頁(yè)是用flash制作的），然后S Gallery完全模仿了它。當(dāng)某個(gè)單元格被點(diǎn)擊并且獲取到焦點(diǎn)的時(shí)候，你就可以通過(guò)向前-向后按鈕或方向鍵來(lái)瀏覽其他的圖片。
11. Twenty Twenty
TwentyTwenty 是一個(gè)視覺(jué)擴(kuò)散工具，非常容易的就能夠辨認(rèn)出它們。它的原理是兩張圖片互相堆疊在對(duì)方的上面。當(dāng)滑塊移動(dòng)通過(guò)整個(gè)圖像的時(shí)候，它利用css的屬性來(lái)調(diào)整左側(cè)的圖像。這允許右邊的圖像顯示通過(guò)容器。
12. SMint
Smint 是一款簡(jiǎn)便的jQuery插件，她可以幫助你實(shí)現(xiàn)一頁(yè)風(fēng)格網(wǎng)站的導(dǎo)航。她由兩個(gè)元素組成，一個(gè)是粘性的導(dǎo)航條，他可以在你滾動(dòng)你的頁(yè)面時(shí)停留在整個(gè)頁(yè)面的頂部；另一個(gè)是菜單按鈕，它可以自動(dòng)地讓頁(yè)面滾動(dòng)到你鎖點(diǎn)擊的區(qū)域。SMINT是一個(gè)簡(jiǎn)單的插件，她又一個(gè)選項(xiàng)可以控制頁(yè)面的滾動(dòng)速度。她的默認(rèn)速度是半秒鐘，當(dāng)然你也可以把她設(shè)置到任意你想要的時(shí)間。下載的組件中還包含有例子，她們都可以免費(fèi)的作為您單頁(yè)網(wǎng)站的惹眼的模板。
13.Loda Button:加載時(shí)的動(dòng)態(tài)按鈕
Loda Button 是一款簡(jiǎn)易的jq插件動(dòng)態(tài)按鈕圖標(biāo)，在等待從服務(wù)器獲取數(shù)據(jù)時(shí)使用。loda-btn和loda-icon的樣式被用在了這款插件的按鈕組件中。他的樣式十分簡(jiǎn)單，并且放置在loda-button.css文件中。此組件的動(dòng)態(tài)效果是使用支持Chrome,Firefox,Opera和IE10的css3的animation,transitions和transforms實(shí)現(xiàn)的。
14. Pop Easy
PopEasy是一個(gè)輕量jQuery插件，它是任何一個(gè)像輕易創(chuàng)建模態(tài)窗口的開(kāi)發(fā)者所必備的。通過(guò)在你的頁(yè)面上應(yīng)用一個(gè)遮罩效果并彈出一個(gè)定制的模態(tài)窗口，來(lái)讓你的焦點(diǎn)放在重要的信息上。
要在頁(yè)面上使用多個(gè)模態(tài)窗口，你必須在你希望打開(kāi)的div層中同步id觸發(fā)器的href屬性。這種工作原理和從一個(gè)彈出的模態(tài)過(guò)渡到另一個(gè)模態(tài)的原理是一樣的。只需要在你希望離開(kāi)的模態(tài)窗口中放置一個(gè)href連接，它和另一個(gè)模態(tài)的id相匹配。
源碼
15. Reveal
Reveal很了不起，實(shí)現(xiàn)起來(lái)也簡(jiǎn)單，是一個(gè)跨瀏覽器并兼容現(xiàn)代瀏覽器(還帶有優(yōu)雅降級(jí)功能)。同時(shí)它很輕量，只有1.75KB。設(shè)置Reval模態(tài)只需要三步。附加所需文件，放入模態(tài)的標(biāo)記處然后給你的按鈕添加屬性。Reval遵守MIT許可。
16. Hide/Show Password Plugin
Hide/show Password插件讓你輕易隱藏和顯示密碼輸入欄中的內(nèi)容。這個(gè)插件最酷的部分就是”innerToggle“選項(xiàng)。當(dāng)設(shè)置為開(kāi)的時(shí)候，它可以很容易創(chuàng)建漂亮隱藏/顯示 控件，你可以定制自己喜歡的樣式。在觸屏瀏覽器中，你滑動(dòng)的時(shí)候它甚至能保持輸入焦點(diǎn)。
17. Readmore.js
Readmore.js是一個(gè)平滑的，輕量的jQuery插件，用于折疊和展開(kāi)大段的文本。并帶有“閱讀更多”和“關(guān)閉”鏈接。 Readmore.js所需的標(biāo)記語(yǔ)言極其輕量而簡(jiǎn)單。不需要div層的復(fù)雜設(shè)置或者硬編碼的類(lèi)名，只需要在包含大段文本的元素里調(diào)用.readmore()，Readmore.js就會(huì)幫你處理剩余的工作。
18.向上滾動(dòng)
ScrollUp是一個(gè)輕量級(jí)jQuery插件，它可以簡(jiǎn)單的創(chuàng)建適用于任何網(wǎng)站的用戶(hù)自定義“向上滾動(dòng)”特性。給activeOverlay設(shè)置一個(gè)可用的CSS顏色，這樣你可以創(chuàng)建一個(gè)可見(jiàn)的線(xiàn)條幫助你決定一個(gè)適合的高度(出現(xiàn)向上滑動(dòng)的標(biāo)識(shí),譯注)。
19.FlipClock.js
FlipClock.js是一個(gè)可呈現(xiàn)任何和時(shí)間相關(guān)的可重復(fù)性特效的jQuery插件。FlipClock.js可支持作為一個(gè)時(shí)鐘，倒計(jì)器和計(jì)時(shí)器，同時(shí)用戶(hù)也自定義完整的CSS來(lái)改變它的外觀。它有可以自動(dòng)開(kāi)始的選項(xiàng)，還有很多回調(diào)方法來(lái)控制(start,stop,getTime,setTime...)。同時(shí)，它也有可以增加功能的全功能API。