用於前端開發的 50 個最有用的 jQuery 插件

已發表: 2021-06-15

還有許多其他可用的 JavaScript 框架,但 jQuery 顯然是最受歡迎的(根據 BuiltWith,目前超過 78% 的頂級百萬網站使用它)。

jQuery 的目的是使許多通常需要多行代碼的 JavaScript 函數更易於管理和編寫,方法是將它們捆綁到只需一行代碼即可調用的方法中。

它是輕量級的,並且因為它是可擴展的,所以幾乎所有你能想到的功能都可以免費使用 jQuery 插件。

目錄:

  • 網絡和移動佈局插件
  • 菜單和導航插件
  • 媒體插件
  • 滑塊、輪播和圖庫插件
  • 文字效果插件
  • 表單插件
  • 實用插件

更多 jQuery 插件:

  • 動態佈局 jQuery 插件
  • 表單驗證 jQuery 插件
  • 圖庫和燈箱 jQuery 插件
  • 響應式導航 jQuery 插件
  • 滑塊和輪播 jQuery 插件
  • Typogrpahy 效果 jQuery 插件

用於 Web 和移動佈局的 jQuery 插件

pagePiling.js

pagePiling.js 是一個 jQuery 插件,用於將您的佈局部分相互“堆疊”並通過滾動訪問它們。

pagePiling.js jQuery 插件,用於將您的部分相互“堆疊”並通過滾動訪問它們

fullPage.js

fullPage.js 是一個用於創建全屏滾動網站的簡單插件。

fullPage.js 全屏滾動網站 jQuery 插件

gridscrolling.js

gridscrolling.js 是一個用於在網格中定位部分和邊的插件,並允許輕鬆的光標鍵導航。

gridscrolling.js jQuery 插件 用於在網格中定位部分和邊的佈局,並允許輕鬆的光標鍵導航

閃片

Flickerplate 是一個響應式、支持觸控的輕量級插件,可讓您“快速瀏覽”內容。

Flickerplate 響應式觸控輕量級輕彈內容

jInvertScroll

jInvertScroll 是一個輕量級的插件,它允許您在向下滾動時使用視差效果水平移動。

jInvertScroll輕量級插件水平視差效果

動畫

Animsition 是一個簡單的插件,用於添加帶有 CSS 動畫的頁面過渡。

Animsition - 一個簡單的 jQuery 插件,用於添加帶有 CSS 動畫的頁面過渡

磚工作

Brick Work 是一個輕量級 (15kb) 且功能豐富的插件,用於創建響應式動態佈局。

Brick Work 是一個輕量級 (15kb) 且功能豐富的 jQuery 插件,用於創建響應式動態佈局

滾動我

ScrollMe 是一個輕量級插件,可讓您為網頁添加簡單的滾動效果。

ScrollMe 是一個輕量級的 jQuery 插件,可以讓你給網頁添加簡單的滾動效果

平滑狀態.js

jquery.smoothState.js 是一個插件,可以逐步增強頁面,使其更像單頁應用程序。

jquery.smoothState.js - 一個 jQuery 插件,可逐步增強頁面以更像單頁應用程序

multiscroll.js

multiscroll.js 是一個簡單的插件,用於創建帶有兩個垂直滾動面板的多滾動網站。

multiscroll.js 是一個簡單的 jQuery 插件,用於在本週設計師新聞中創建多滾動網站

matchHeight.js

matchHeight.js 是一個更強大的 jQuery 等高插件。

jquery.matchHeight.js 是一個更強大的 jQuery 前端等高插件

jQuery 導航和菜單插件

滑動條

Slidebars 是一個輕量級 (2kb) 插件,用於創建應用風格的推送菜單。

滑動條前端應用程序樣式的推送菜單 jquery 插件

scotchPanels.js

scotchPanels.js 是一個 jQuery 非畫布菜單和麵板插件。

scotchPanels.js 一個 jQuery 關閉畫布菜單和麵板插件

用於媒體的 jQuery 插件(圖像和視頻)

焦點

Focuspoint 是一個插件,用於動態裁剪圖像以填充可用空間,而無需剪切圖像的主題。

用於響應式裁剪的 Focuspoint jQuery 插件

流體箱

Fluidbox 是 Medium.com 燈箱模塊的複製品,並進行了一些改進。

Fluidbox 前端 Medium 燈箱模塊 jquery 插件

GIF播放器

GifPlayer 是一個小插件,可讓您控制何時播放和停止動畫 GIF。

GifPlayer 插件控製播放和停止 gif 動畫 jquery

rowGrid.js

rowGrid.js 是一個用於將圖像放置在支持無限滾動的網格上的插件。

rowGrid.js 圖像網格無限滾動前端 jquery 插件

SVG魔術

SVGMagic 是一個簡單的 SVG 後備插件,可以在您的網站上查找 SVG 圖像,並在瀏覽器不支持時創建 PNG 版本。

SVGMagic 簡單的 SVG 後備 jquery 插件

視頻 jQuery

Vide 是一個 jQuery 插件,可輕鬆將視頻背景添加到您的網頁。
Vide - 用於視頻背景的簡單 jQuery 插件

密集的.js

Dense.js 是一個插件,用於輕鬆提供視網膜就緒圖像。

Dense.js - 一個 jQuery 插件,用於輕鬆提供視網膜圖像

封面視頻

Covervid 是一個簡單的插件,可讓您使 HTML5 視頻表現得像背景圖像。

Covervid 是一個簡單的 jQuery 插件,可以讓你的 HTML5 視頻表現得像背景圖像

jQuery-裁剪框

jQuery-Cropbox 是一個非常有用的就地圖像裁剪插件(縮放和平移,而不是選擇和拖動)。

jQuery-Cropbox 圖像裁剪前端 jquery 插件

人臉檢測

人臉檢測是一個強大的 jQuery/Zepto 插件,可以檢測圖像、視頻和畫布上的人臉。
人臉檢測 - 一個強大的 jQuery/Zepto 插件,可以檢測圖像、視頻和畫布上的人臉

BttrLazyLoading

BttrLazyLoading 是一個插件,它允許您的 Web 應用程序僅在用戶滾動時加載視口內的圖像。

BttrLazyLoading 加載圖像視口滾動插件

jQuery 滑塊、輪播和圖庫插件

簡單的 jQuery 滑塊

Simple jQuery Slider 是一個輕量級的 jQuery Slider,它完全可以做一個滑塊應該做的事情:'slides slides'。

超簡單輕量級的jQuery Slider

FSVS

FSVS 是一個簡單的全屏垂直滑塊,使用帶有 jQuery 回退的 CSS3 過渡。
FSVS 使用帶有 jQuery 回退的 CSS3 過渡的簡單全屏垂直滑塊

anoFlow

anoFlow 是一個功能豐富且響應迅速的燈箱/畫廊插件。

anoFlow 功能豐富的響應式燈箱庫插件

納米畫廊

nanoGALLERY 是一個響應迅速、支持觸控且易於使用的圖片庫插件。

nanoGALLERY 響應式觸摸啟用易於使用的圖片庫插件 jquery

Justified.js

Justified.js 是一個插件,可以創建一個對齊的圖像網格。

Justified.js - 一個 jQuery 插件,可以創建一個對齊的圖像網格

隨機播放圖像

Shuffle Images 是一個 jQuery 插件,它允許您通過移動或搖動光標來顯示和隨機播放畫廊中的多個圖像。

Shuffle Images 插件,允許您在圖庫中顯示和隨機播放多個圖像

跳過

Skippr 是一個超級簡單和輕量級的 jQuery 幻燈片插件。

Skippr 是一個超級簡單和輕量級的 jQuery 幻燈片插件

jQuery 文本效果插件

字體Flex.js

fontFlex.js 是一個用於動態更改字體大小的輕量級插件。

jQuery.fontFlex.js 輕量級 jQuery 擴展,用於動態改變字體大小

打字機

t.js 是一個輕量級的 jQuery 插件,用於類似打字機的文本效果。

t.js 輕量級 jQuery 插件,用於類似打字機的文本效果

變形文字

Morphext – Animate.css 支持的 jQuery 輪播插件,用於文本短語。

由 Animate.css 提供支持 Morphext 是一個用於文本短語的簡單 jQuery 輪播插件

拆分字符

Splitchar 是一個 jQuery 插件,可讓您設計和設計字符的前半部分、後半部分或兩部分。

Splitchar 是一個 jQuery 插件,可讓您在本週設計師新聞中設計角色的前半部分、後半部分或兩部分

jQuery 表單元素插件

引導驗證器

BootstrapValidator 是一個用於驗證 Bootstrap 表單的 jQuery 插件。

BootstrapValidator - 一個用於驗證 Bootstrap 表單的 jQuery 插件

標籤美

Labelauty – 一個漂亮且輕量級的 jQuery 插件,為複選框和單選按鈕提供美感。
Labelauty - 一個漂亮且輕量級的 jQuery 插件,為複選框和單選按鈕提供美感

監護人

Guardian 是一個靈活且易於擴展的通用表單驗證 jQuery 插件。
Guardian 靈活且易於擴展的通用表單驗證 jQuery 插件

字體圖標選擇器

fontIconPicker 是一個輕量級插件,允許您在任何表單中包含一個簡單的圖標選擇器(帶有搜索和分頁)。

fontIconPicker 輕量級插件簡單的圖標選擇器

捉迷藏

HideSeek 是一個簡單但可定制的實時搜索 jQuery 插件。

HideSeek 可定制的 jQuery 插件,用於實時搜索

時鐘選擇器

ClockPicker 是一個用於 jQuery 或 Bootstrap 的時鐘樣式的時間選擇器。

ClockPicker 是用於 Bootstrap 或 jQuery 的時鐘樣式時間選擇器

jQuery 實用插件

jQuery 確認郵件

jQuery Confirm Mailto 是一個插件,用於在打開任何mailto:通過他們的默認電子郵件客戶端鏈接。

jQuery Confirm Mailto jQuery 插件在打開 mailto 鏈接之前進行確認

jNottery

jNottery 是一個插件,允許您向頁面添加註釋。

jNottery jQuery 插件,允許您向網頁添加註釋

響應式標籤

響應式標籤是一個提供響應式標籤功能的插件。

響應式選項卡 一個提供響應式選項卡功能的 jQuery 插件

自適應背景.js

Adaptive-backgrounds.js 是一個很酷的插件,它從你的網頁上的圖像中提取主色並將顏色應用到它們的父級。

從網頁上的圖像中提取主色並神奇地將顏色應用於其父 jquery 插件

……最後……

天文館

Planetarium 是一個 jQuery 插件,可讓您構建交互式行星並構建宇宙!

jQuery.planetarium 構建交互式行星並構建宇宙

表拖

table-dragger 允許您在沒有 jQuery 的情況下輕鬆地將拖放排序添加到表中。

表拖

選擇器

Selector 是一個微型 JavaScript 庫,用作 jQuery 的替代品,大小接近 5KB。

選擇器

wanker.js

jquery.wanker.js 是一個幽默的 jQuery 插件,當人們在嘗試查看響應式斷點時開始過度調整桌面瀏覽器的大小時,它會顯示一個公共服務公告。 正如他們所說,“網絡是用來閱讀的,而不是用來壓扁的!”

jquery.wanker.js 前端 jquery 插件