首頁»HTML/CSS»前端插件庫

前端插件庫

來源:寒青 發布時間:2019-05-26 閱讀次數:

前端插件庫

DataTables

官網:https://www.datatables.net/

DataTables是jQuery的JavaScript函數庫,目的是強化表格操作(如搜索、排序),并自動加入組件引入表格中,使用非常靈活簡便。

LazyLoad

官網:Lazy Load
延伸:Vanilla JavaScript Lazy Load Plugin

Lazy Load幫助高度較長的網頁進行延遲載入圖片,尚未瀏覽到該部分時,不會載入視角外的圖片,提高效率。

lightSlider

官網:JQuery lightSlider
Github:sachinchoolur/lightslider

JQuery lightSlider是一個輕量且響應式的跑馬燈/幻燈片,附有縮圖導覽。另外還有相本功能、垂直跑馬燈,應用層面廣泛。

alertify.js

官網:https://fabien-d.github.io/alertify.js/
Github:alertify.js

alertify.js是為了美化通知信息而生的JavaScript框架。

pickadate.js-日期/時間選擇器

官網:pickadate.js

chosen

官網:Chosen
Github:chosen

Chosen是一個jQuery的插件,目的是讓又長又笨重的下拉式選單變得更友善。

typeahead.js

Github:typeahead.js

由Twitter推出,靈活扎實的建議列表函數庫。

textillate.js

官網:textillate.js
Github:jschr/textillate

textillate.js結合了很多很棒的函數庫,簡單應用CSS3動畫特效。

Chart.js

官網:Chart.js

對設計師或開發人員,淺顯易懂的JavaScript圖標應用。

highlight.js

官網:highlight.js
Github:highlight.js

針對Web程序所做的高亮顯示上色。

jquery-loading

官網:jquery-loading

起源于為了在讀取或運行中,鎖住特定對象,并同時保持讓瀏覽者可以操作頁面的其他部分。

jquery-validation

官網:jQuery Validation
Github:jquery-validation

jQuery Validation插件讓用戶端檢查表單變得更容易,并提供大量的定制化設定,無論導入新開發或是現有的項目都是很好的選擇。

Moment.js

官網:Moment.js

輕量級專門解析、驗證、操作、格式化日期的JavaScript函數庫,Moment.js是為瀏覽器和Node.js而設計,所有組件都可以在這兩個環境下運行。

Animate.css

官網:Animate.css

純CSS,無需JavaScript,支持多瀏覽器的動畫特效,即插即用。

Ace

官網:Ace

Ace是透過JavaScript所開發的線上程序語言編輯器插件,無論功能和性能都類似一般編輯器(Sublime、Vim和TextMate等),導入進任何網頁或JavaScript應用程序都相當容易。值得一提的是Ace是由Cloud9 IDE的團隊維護,并且是Mozilla Skywriter(Bespin)項目的延伸品,品質值得信賴。

PDF.js.js

官網:PDF.js

PDF.js是一個由HTML構建的PDF閱讀器,由Mozilla Labs所推廣,目標是建立一個通用的PDF平臺。

reveal.js-網頁變簡報

官網:REVEAL.JS

Intro.js-網站導航

官網:Intro.js

優化網站的導航功能,提供步驟指南給瀏覽者,強化網站的用戶體驗。

Fine Uploader-拖拽上傳

官網:fine-uploader
Github:fine-uploader

導入拖拽上傳檔案,跨瀏覽器、原生JavaScript又加上免費開源,只要載入JavaScript就可以開始運行,不依賴其他程序。

parallax.js

官網:parallax.js
Github:wagerfield/parallax

對任何設備,兼容性高的視差引擎。

Hover.css

官網:Hover.css
Github:IanLunn/Hover

多項針對鏈接、按鈕、Logo、SVG和圖片的移入CSS3特效。

iscroll

Github:cubiq/iscroll

iScroll是一款高性能、文件小、無依賴且多平臺的JavaScript拖拽滑動庫。

Toolbar.js

官網:Toolbar.Js
Github:paulkinzett/toolbar

一個產生工具列的jQuery插件。

nanoScroller.js

Github:nanoScrollerJS

nanoScroller.js是一個用簡單方法做出類似Mac OS X風格卷軸的jQuery插件,盡管目前沒有在持續維護,但使用上相當簡單且支持度高仍然是不錯的選擇。

iCheck

官網:iCheck
Github:icheck

專為jQuery和Zepto做的高彈性定制化checkbox和radio按鈕的插件。

KUTE.js

官網:KUTE.js
Github:kute.js

一個成熟的原生的JavaScript動畫引擎,提供給網站開發者、設計師、動畫師相當多基本的功能,淺顯易懂的操作方式,跨瀏覽器動畫,擁有著高質量、靈活、專業且輕量(主要核心只需要17K)。

Timeline.js

官網:Timeline.js

jQuery時間軸插件,使用簡單是它的優點。

Muuri.js

官網:Muuri

Muuri是一個JavaScript Layout引擎,讓你可以構建多樣化的Layout,并具有響應式、可排序、可過濾、拖拽移動或動畫效果。

Algolia Places

官網:Algolia Places

Algolia Places為您的網站提供一個快速、簡單的方式,自動化產生地址建議列表的JavaScript函數庫。

lightgallery.js

官網:lightgallery.js
Github:lightGallery

一個彈性高、組件化且響應式的燈箱jQuery插件。

Tabslet

官網:Tabslet
Github:Tabslet

一個用于頁簽的jQuery插件,輕量級且操作容易。

Masonry.js

官網:Masonry

Masonry常用于瀑布流布局的插件。

Slidebars

官網:Slidebars
Github:Slidebars

Slidebars是一個jQuery框架,提供網站或網站應用程序側邊欄選單。

three.js

官網:three.js
Github:three.js

易于使用且輕量級3D函數庫,提供canvas、SVG、CSS3 3D和WebGL渲染器。

Videos.js-HTML5視頻播放器

官網:Video.js: The Player Framework
Github:video.js

Video.js是隨著HTML5的來襲所打造的媒體播放器,支持HTML5和Flash視頻,支持PC和移動設備。這個項目從2010年開始,現在已經有超過40萬的網站使用它。

Leaflet.js

官網:Leaflet
Github:Leaflet

Leaflet是一個對移動設備友善的互動地圖并且開源的JavaScript函數庫,總大小只有38KB,卻有著大多數開發人員想要的需要。簡單、專業、實用并且跨平臺可以有效率地在PC和移動設備上,并且有大量的插件可以擴展,有著華麗卻簡單使用的API,很易學且閱讀性高的源碼。

Sortable

官網:SortableJS

Sortable可以對HTML對象做拖拽移動清單的JavaScript函數庫,支持移動設備且不依賴jQuery等其他第三方,并兼容Bootstrap等CSS框架。

clipboard.js

官網:clipboard.js
Github:clipboard.js

復制內容到剪切板的小工具,不依賴Flash,大小只要3KB。

howler.js

官網:howler.js

howler.js是針對當下網站的一個音頻播放函數庫,預設為Web Audio API和HTML5 Audio,可以透過JavaScript播放聲音變得更簡單,并且跨平臺。

p5.js-繪畫插件

官網:p5.js
Github:processing/p5.js

p5.js是一個JavaScript函數庫,有完整的繪畫功能,并不局限在畫布上,你可以把整個瀏覽器當做你的草稿,另外有插件可以讓你更容易去做HTML5互動,加入文字欄、影片、視頻或音頻等功能。

fullPage.js-全頁式導航

官網:fullPage.js
Github:fullPage.js

store.js

Github:store.js

針對任何項目都可以做的跨瀏覽器的數據存取,全站都可以運行,瀏覽器支持度高,小項目不想導入大型框架的不錯選擇。

fullcalendar

官網:JavaScript Calendar
Github:fullcalendar

設計一個滿版且可拖拽事件的行程日歷。Bootstrap的排版風格,可讀入JSON格式數據,安裝容易、支持響應式排版。

Headroom.js

官網:Headroom.js

把網站空間發揮到極限,不需要導航列表是隱藏,需要時出現。搭配Animation.css可以讓畫面更活潑,另外也支持jQuery或Angular。

ScrollToFixed

官網:ScrollToFixed

ScrollToFixed能夠讓網頁的導航或表頭等固定在頂部或底部,用戶更方便的操作或查看信息。除了導航和表頭,也可以固定其他內容,比如廣告、返回頂部等。

Handlebars.js

官網:Handlebars.js
Github:handlebars.js

Handlebars主要是讓你在做語義化模板時更有效率、且不容易受挫,并且兼容Mustache模板,大多數可以直接互換使用。

faker.js

Github:faker.js

faker.js可以在瀏覽器或Node.js產生大量的假數據。測試時期相當方便的東西,也可以透過Google Extension來運行。

TinyMCE-HTML編輯器

官網:TinyMCE
Github:tinymce

TinyMCE是功能齊全且輕量級的HTML編輯器,但需要在IE11以上才可以運行。

List.js-資料排序

官網:List.js
Github:list.js

List.js對表格、清單、各式各樣的對象,增加搜索、排序、過濾和靈活性,無形地建立在HTML內,極簡易也易于使用。即便周邊不如DataTables,但不依賴jQuery及大小僅Datatables的1/4(壓縮后17KB),以及對IE的高兼容性和不止對<table>,對<ul>、<ol>或是其他HTML元素的支持,都是List.js不容忽視的優勢之一。

Swiper

官網:Swiper
Github:Swiper

Swiper是當下王錚的幻燈片/跑馬燈插件,使用效能高,并可運用在移動設備上及混合式App上,不但在最新版本的IOS上運行良好,在Android、Windows Phone 8和PC設備上一樣表現優秀。要注意的是,Swiper并不兼容所有平臺設備,而是專注于當下主流平臺設備的兼容性和效能上。同時Swiper也是Framework7Ionic Framework的組件的一部分。

toastr

官網:Toastr

toastr是一個提示信息JavaScript函數庫,必須載入jQuery,宗旨是利用簡單的程序函數庫來做定制化跟擴展。toastr提供一個范例頁面toastr examples,方便自訂效果跟產生源碼,類似Customize and download · Bootstrap的效果,方便使用者加快流程,先前介紹的ALERTIFY JS整體層面比toastr好很多,無論原生JavaScript以及整體文件大小和功能延展性,但toastr簡單使用的操作模式,如果有舊項目是在jQuery的環境下,要做一些定制化功能,或許就是不錯的選擇。

goodshare.js-極簡動畫繪制

官網:Sketch.js

Quill

官網:Quill
Github:Quill

Quill是當下高兼容性、強大、豐富且具有擴展性的文字編輯器。對于移動設備的支持度高。

Shave-截斷文字

官網:Shave

Shave根據內容的最大高度將文字截斷,是一個沒有任何依賴性的JavaScript插件。并將多出的文字藏在span后面,保留原文的完整性。CSS本身通過text-overflow也有類似的功能(Truncate String with Ellipsis),但需要設定寬度,如果需要不能固定寬度的項目,Shave應該是一個不錯的選擇。

Tabulator

官網:Tabulator

Tabulator是相當容易操作的表格內容產生器,只需要花很少的時間就可以通過把數組或JSON格式的資料生成HTML界面的表格。并且支持響應式網頁,以及運用其他插件做成對象產生資料圖表。

ScrollReveal-動態顯示內容

官網:ScrollReveal

datedropper

官網:datedropper
Github:datedropper

datedropper是微型但功能強大的jQuery時間選擇器。內建風格相當活潑可愛,可增加網站的活力。

Cleave.js-表單欄位格式化工具

官網:Cleave.js

Infinite Scroll

官網:Infinite Scroll

Infinite Scroll是jQuery一個用來實現無限滾動的插件。

QQ群:WEB開發者官方群(515171538),驗證消息:10000
微信群:加小編微信 849023636 邀請您加入,驗證消息:10000
提示:更多精彩內容關注微信公眾號:全棧開發者中心(fsder-com)
網友評論(共0條評論) 正在載入評論......
理智評論文明上網,拒絕惡意謾罵 發表評論 / 共0條評論
登錄會員中心
大神带着买彩票 林芝县| 通山县| 新乡市| 厦门市| 重庆市| 邢台市| 阿勒泰市| 寿光市| 祁阳县| 竹溪县| 大安市| 新宁县| 镇宁| 民县| 星座| 商丘市| 溧阳市| 阿拉尔市| 汨罗市| 黄山市| 富顺县| 乐业县| 兴隆县| 同仁县| 贵溪市| 文水县| 宁陕县| 苍南县| 罗平县| 大新县| 安岳县| 漠河县| 广西| 炉霍县| 六枝特区| 南阳市| 台北县| 宁武县|