Github資源匯集
突然發(fā)現(xiàn)申請(qǐng)博客園已經(jīng)兩年有余,沒(méi)有發(fā)表過(guò)一篇文章,十分慚愧。
言歸正傳,先分享一下兩年來(lái)收集的部分編程資源,大部分為Github上的項(xiàng)目。雖然網(wǎng)上這樣的分享已不在少數(shù),但不如我理想中的集中,實(shí)用。如果早些時(shí)間我有這些資源,估計(jì)少走了很多彎路。
篇幅有限,僅列出綜合資源, JavaScript, CSS的,限于篇幅,其于的在
Github
上,就不列出來(lái)了。
綜合資源
資源鏈接匯集
- awesome ?- 各種主流語(yǔ)言的優(yōu)秀項(xiàng)目匯集
- github_star.md ?- 同上
- lists ?- 資源集合的匯集
- frontend-dev-bookmarks ?- Github上最火的前端開(kāi)源項(xiàng)目匯集
- awesome-bootstrap ?- bootstrap 資源匯集
- awesome-sysadmin ?- 系統(tǒng)管理員資源匯集
- awesome-wpo ?- Web性能優(yōu)化資源匯集
- awesome-react ?- Facebook React庫(kù)相關(guān)資源匯集
- manong ?- 碼農(nóng)周刊整理: 按語(yǔ)言或技術(shù)分類的資料匯集
- awesome-resources ?- 開(kāi)發(fā)資源總結(jié)
電子書(shū)
- GitHub秘籍 ?- 本秘籍收錄了一些Git和Github非??嵬瑫r(shí)又少有人知的功能
- free-programming-books ?- 編程學(xué)習(xí)資源電子書(shū)
- free-programming-books-zh_CN ?- 編程學(xué)習(xí)資源電子書(shū)中文版
- The-Art-Of-Programming-By-July ?- 此為《程序員編程藝術(shù):面試和算法心得》的初稿,于14年6月轉(zhuǎn)移到Word上優(yōu)化,紙質(zhì)版15年上市
- learn-with-open-source ?- 借助開(kāi)源項(xiàng)目,學(xué)習(xí)軟件開(kāi)發(fā)
- Front-end-Developer-Interview-Questions ?- 前端工作面試問(wèn)題
- You-Dont-Know-JS ?- 深入JavaScript語(yǔ)言核心機(jī)制的系列圖書(shū)
- es6tutorial ?- 《ECMAScript 6入門(mén)》是一本開(kāi)源的JavaScript語(yǔ)言教程,全面介紹ECMAScript 6新增的語(yǔ)法特性
- fks ?- 前端技能匯總
- book ?- 雨痕C/Go/Python學(xué)習(xí)筆記
優(yōu)秀網(wǎng)站
- 綜合
- stackexchange.com ?- 包含 Stack Overflow 在內(nèi)的43個(gè)不同領(lǐng)域站點(diǎn)的問(wèn)答社區(qū)的總和
-
codeproject ?- 開(kāi)源的程序設(shè)計(jì)網(wǎng)站,主要的使用者是Windows平臺(tái)上的程序員,每一篇文章幾乎都附有來(lái)源碼和例子
- 新聞?lì)?
-
Hacker News ?- 關(guān)于電腦黑客和創(chuàng)業(yè)公司的社會(huì)化新聞網(wǎng)站
- 博客類
-
伯樂(lè)在線 ?- 小而精的精選博客,優(yōu)秀的原創(chuàng)/譯文
個(gè)人博客
- 粉絲日志 ?- 跨界的IT博客|Hadoop家族, R, RHadoop, Nodejs, AngularJS, KVM, NoSQL, IT金融
-
夢(mèng)想天空(山邊小溪)的博客園 ?- 前端開(kāi)發(fā)技術(shù)/網(wǎng)頁(yè)設(shè)計(jì)資源/HTML5 & CSS3技術(shù)分享
- 前端相關(guān)
- codepen.io ?- 優(yōu)秀HTML和CSS展示網(wǎng)站 :+1:
- front-end-collect ?- 前端開(kāi)發(fā)相關(guān)的優(yōu)秀網(wǎng)站、博客、以及活躍開(kāi)發(fā)者
- codrops ?- 包含大量的優(yōu)秀的前端交互案例,有大量炫酷的HTML5特效、CSS3特效、Js特效,有大量的前端設(shè)計(jì)教程
- Java相關(guān)
- programcreek ?- Java 代碼大全 :+1:
-
ImportNew ?- 專注Java & Android 技術(shù)分享
- 其它
-
Algomation ?- 查看、創(chuàng)建和分享算法的學(xué)習(xí)平臺(tái)
工具
- jsdelivr ?- 免費(fèi)開(kāi)源的 CDN 解決方案,用于幫助開(kāi)發(fā)者和站長(zhǎng)。包含 JavaScript 庫(kù)、jQuery 插件、CSS 框架、字體等等 Web 上常用的靜態(tài)資源)
- freecdn ?- 前端公共庫(kù)cdn
- soundjay ?- 用于網(wǎng)站使用的各種聲音特效
- docker ?- 開(kāi)源的應(yīng)用程序容器引擎
API && 文檔 && 規(guī)范
- Best practices for modern web development
- 谷歌 Web 開(kāi)發(fā)最佳實(shí)踐手冊(cè)(伯樂(lè)在線中文版)
- google-styleguide ?- Google 風(fēng)格指南
- AngularJS風(fēng)格指南
- angularjs-style-guide ?- AngularJS風(fēng)格指南
- angularjs-styleguide ?- AngularJS風(fēng)格指南(中文版)
- AngularJS-Learning ?- AngularJS指南
- gradle 中文文檔
- Gradle-2-User-Guide (Gradle 2 User Guide 中文翻譯)
- gradledoc (Gradle 用戶手冊(cè)) - 翻譯中
- material_design_zh ?- Material Design 中文協(xié)同翻譯
- websocket-protocol ?- websocket協(xié)議翻譯
- TLCL ?- The Linux Command Line(中文版)
JavaScript
- JavaScript
- 包管理器 (Package Managers)
- 加載器 (Loaders)
- 測(cè)試框架 (Testing Frameworks)
- QA工具 (QA Tools)
- 構(gòu)建工具 (Building Tools)
- MVC框架 (MVC Frameworks and Libraries)
- 非MVC框架 (Non-MVC Frameworks)
- UI 框架 (UI Frameworks)
- 模板引擎 (Templating Engines)
- 數(shù)據(jù)綁定 (Data Binding)
- 文件上傳 (File Upload)
- 編輯器 (Editors)
-
實(shí)用工具
- 工具 (Utility)
- 文件 (Files)
- 格式化 (Code Formatting)
- 函數(shù)式編程 (Functional Programming)
- 響應(yīng)式編程 (Reactive Programming)
- Promise
- 數(shù)據(jù)結(jié)構(gòu) (Data Structure)
- 時(shí)間 (Date)
- 字符串 (String)
- 數(shù)字 (Number)
- 存儲(chǔ) (Storage)
- 顏色 (Color)
- 國(guó)際化和本地化 (I18n And L10n)
- 類 (Class)
- 流程控制 (Control Flow)
- 路由 (Routing)
- 安全 (Security)
- 日志 (Log)
- 正則表達(dá)式 (RegExp)
- 多媒體 (Media)
- 語(yǔ)音指令 (Voice Command)
- API
- 視覺(jué)檢測(cè) (Vision Detection)
-
UI
- 代碼高亮 (Code Highlighting)
- 加載狀態(tài) (Loading Status)
- 延遲加載 (Lazy Load)
- 數(shù)據(jù)驗(yàn)證 (Validation)
- Keyboard Wrappers
- Tours And Guides
- 通知 (Notifications)
- 滑塊 (Sliders)
- 范圍滑塊 (Range Sliders)
- 表單組件 (Form Widgets)
- 工具提示 (Tooltips)
- 定位 (Positioning)
- 模態(tài)框和彈出窗 (Modals and Popups)
- 滾動(dòng) (Scroll)
- 菜單 (Menu)
- 表格/網(wǎng)格 (Table/Grid)
- 分頁(yè) (Pagination)
- 可編輯的 (Editable)
- 排序 (Sortable)
- 圖表 (Chart)
- WebGL
- 圖形庫(kù) (Graphics Library)
- 圖片相關(guān) (Images)
- 背景 (Background)
- 特效組件 (Effects Widgets)
- 導(dǎo)航 (Navigation)
- 響應(yīng)式 (Responsive)
- 拖放 (Drag/Drop)
- 相冊(cè) (Gallery)
- Material
- SVG手繪動(dòng)畫(huà)
-
移動(dòng)端
- 地圖 (Maps)
- 動(dòng)畫(huà) (Animations)
====
Package Managers
在遠(yuǎn)程主機(jī)存放JavaScript庫(kù),并提供工具下載到本地或打包上傳
- bower (twitter 推出的一款包管理工具,基于nodejs的模塊化思想,把功能分散到各個(gè)模塊中,讓模塊和模塊之間存在聯(lián)系,通過(guò) Bower 來(lái)管理模塊間的這種聯(lián)系)
- spm ?- Brand new static package manager.
Loaders
JavaScript模塊或加載系統(tǒng)
- headjs (The only script in your HEAD)
- RequireJS ?- A file and module loader for JavaScript.
- SeaJS ?- A Module Loader for the Web.
Testing Frameworks
- qunit ?- An easy-to-use JavaScript Unit Testing framework.
- jasmine (DOM-less simple JavaScript testing framework)
- jquery-mockjax (The jQuery Mockjax Plugin provides a simple and extremely flexible interface for mocking or simulating ajax requests and responses)
- jquery-mockjax ?(模擬ajax請(qǐng)求和響應(yīng))
QA Tools
- JSHint ?- JSHint is a tool that helps to detect errors and potential problems in your JavaScript code.
Building Tools
- generator ?(為你提供項(xiàng)目腳手架的生成系統(tǒng), 完成新建文件、安裝模塊、類庫(kù)等重復(fù)性操作)
MVC Frameworks and Libraries
- angular.js ?- HTML enhanced for web apps.
- backbone ?- Give your JS App some Backbone with Models, Views, Collections, and Events.
Non-MVC Frameworks
非MVC結(jié)構(gòu)框架,主要是綜合性的工具類庫(kù)
- ember.js (A JavaScript framework for creating ambitious web applications)
- react (A declarative, efficient, and flexible JavaScript library for building user interfaces.)
- aralejs (開(kāi)放、簡(jiǎn)單、易用的前端基礎(chǔ)類庫(kù))
- todomvc (Backbone.js, Ember.js, AngularJS及更多框架版本的TODO應(yīng)用)
UI Frameworks
- fuelux (Extends Twitter Bootstrap with additional lightweight JavaScript controls.)
-
ionic
(Advanced HTML5 mobile development framework and SDK. Build great hybrid apps with web technologies you already know and love. Best friends with AngularJS.
)
Data Binding
- way.js (簡(jiǎn)單、輕量級(jí)、穩(wěn)定的雙向數(shù)據(jù)綁定庫(kù))
- bindonce (Zero watches binding for AngularJs)
- swarm (JavaScript replicated model (M of MVC) library)
Templating Engines
使用戶界面與業(yè)務(wù)數(shù)據(jù)(內(nèi)容)分離,提高開(kāi)發(fā)效率
- handlebars.js (JavaScript語(yǔ)義模板庫(kù),通過(guò)對(duì)view和data的分離來(lái)快速構(gòu)建Web模板)
- mustache.js (Minimal templating with {{mustaches}} in JavaScript)
- artTemplate (性能卓越的 js 模板引擎)
Data Visualization
以圖表或圖形化方式展示數(shù)據(jù)
Timeline
- TimelineJS (A Storytelling Timeline built in JavaScript)
Gantt
- jQueryGantt (jQuery Gantt editor)
Mind Map
- treed (Powerful Tree Editor)
- springy (A force directed graph layout algorithm in JavaScript)
- arbor (a graph visualization library using web workers and jQuery)
PPT
- nodePPT (這可能是迄今為止最好的網(wǎng)頁(yè)版PPT)
- impress.js (It's a presentation framework based on the power of CSS3 transforms and transitions in modern browsers and inspired by the idea behind prezi.com.)
Flowchart
- mermaid (Generation of diagram and flowchart from text in a similar manner as markdown)
File Upload
- jQuery-File-Upload (功能強(qiáng)大的 文件上傳 組件,你值得擁有)
- plupload (Plupload is a JavaScript API for dealing with file uploads it supports features like multiple file selection, file type filtering, request chunking, client side image scaling and it uses different runtimes to achieve this such as HTML 5, Silverlight and Flash. )
- webuploader (It's a new file uploader solution!)
- angular-file-upload (An AngularJS directive for file upload using HTML5 with FileAPI polyfill for unsupported browsers)
Editors
- brackets (開(kāi)源的JavaScript、HTML、CSS網(wǎng)頁(yè)代碼編輯器)
- CodeMirror
Utility
JavaScript實(shí)用工具庫(kù)
- underscore (JavaScript工具庫(kù),提供了常用的功能函數(shù),而不繼承任何JavaScript內(nèi)置對(duì)象)
- jquery-mousewheel (A jQuery plugin that adds cross-browser mouse wheel support.)
- 101 (A modern JS utility library)
- jsqrcode (Javascript QRCode scanner)
- ChromeSnifferPlus (Chrome探測(cè)器,可以探測(cè)正在使用的開(kāi)源軟件或者js類庫(kù))
- zeroclipboard (The ZeroClipboard library provides an easy way to copy text to the clipboard using an invisible Adobe Flash movie and a JavaScript interface.)
- jsdoc (An API documentation generator for JavaScript. )
- FeHelper (Web前端助手--FeHelper(Chrome擴(kuò)展))
- minimap (A preview of full webpage or its DOM element with flexible positioning and navigation support :+1:)
Files
Code Formattring
- js-beautify (javascript 代碼格式化)
Functional Programming
把運(yùn)算過(guò)程盡量寫(xiě)成一系列嵌套的函數(shù)調(diào)用的"結(jié)構(gòu)化編程"的JavaScript庫(kù)
- underscore ?- JavaScript's utility _ belt.
Reactive Programming
更加有效率地處理事件流,而無(wú)需顯式去管理狀態(tài)
- RxJS (The Reactive Extensions for JavaScript)
- ripple (A tiny foundation for building reactive views)
Data Structure
- immutable-js (Immutable Persistent Data Collections for Javascript)
- seamless-immutable (Immutable data structures for JavaScript which are backwards-compatible with normal JS Arrays and Objects.)
- sift.js ?(受MongoDB啟發(fā)的數(shù)組過(guò)濾庫(kù))
Date
- moment (Parse, validate, manipulate, and display dates in javascript.)
- date (Date() for humans)
- timezone-js (Timezone-enabled JavaScript Date object. Uses Olson zoneinfo files for timezone data.)
String
- underscore.string (String manipulation extensions for Underscore.js javascript library. )
- string.js (Extra JavaScript string methods.)
Number
- numbers.js (Advanced Mathematics Library for Node.js and JavaScript)
- accounting.js (A lightweight JavaScript library for number, money and currency formatting - fully localisable, zero dependencies)
- buddy.js (Magic number detection for JavaScript)
- jquery-number (Easily format numbers for display use. Replace numbers inline in a document, or return a formatted number for other uses.)
Promise
- q (A tool for making and composing asynchronous promises in JavaScript)
- promise (Bare bones Promises/A+ implementation)
- promisejs (Lightweight javascript implementation of promises.)
Storage
- localForage (Offline storage, improved. Wraps IndexedDB, WebSQL, or localStorage using a simple but powerful API)
- jStorage (jStorage is a simple key/value database to store data on browser side)
- cross-storage (Cross domain local storage, with permissions)
- Cookies (JavaScript Client-Side Cookie Manipulation Library)
- jquery-cookie (簡(jiǎn)單、輕量級(jí)的cookie操作的jQuery插件)
Color
- jquery.adaptive-backgrounds.js (A jQuery plugin for extracting the dominant color from images and applying the color to their parent)
- jquery-minicolors (jQuery MiniColors Plugin :+1:)
- TinyColor (Fast, small color manipulation and conversion for JavaScript)
- jquery-simplecolorpicker (Very simple jQuery color picker)
- color-thief (Grabs the dominant color or a representative color palette from an image. Uses javascript and canvas)
- randomColor (A color generator for JavaScript)
- jquery-color (jQuery plugin for color manipulation and animation support)
- color (color visualization in 3D)
I18n And L10n
國(guó)際化和本地化
- i18n-js (It's a small library to provide the I18n translations on the Javascript. It comes with Rails support)
- i18next (internationalisation (i18n) with javascript the easy way (incl. jquery plugin))
- jquery-i18n (A jQuery plugin for doing client-side translations in javascript)
- l10n.js (Passive localization JavaScript library)
Class
JavaScript類繼承模型
- klass (A utility for creating expressive classes in JavaScript)
Control Flow
- wind (Wind.js是很有特點(diǎn)的一個(gè)JavaScript異步編程類庫(kù)(其前身為Jscex), Wind.js的唯一目的便是“改善編程體驗(yàn)”,改善的“程度”以及改善的“方式”便是Wind.js與其他異步流程控制方案最大的區(qū)別)
- co (The ultimate generator based flow-control goodness for nodejs (supports thunks, promises, etc))
- step (An async control-flow library that makes stepping through logic easy.)
Routing
- director (a tiny and isomorphic URL router for JavaScript)
- page.js (Micro client-side router inspired by the Express router (~1200 bytes))
- crossroads.js (JavaScript Routes)
- pathjs (Simple, lightweight routing for web browsers)
- app-router (Router for Web Components)
- jquery-address ?(jQuery Address - Deep linking for the masses)
- history.js (gracefully supports the HTML5 History/State APIs)(pushState, replaceState, onPopState) in all browsers)
- js-url (簡(jiǎn)單、輕量級(jí)的url解析器)
- ui-router (The de-facto solution to flexible routing with nested views)
Security
- H5SC (HTML5 Security Cheatsheet)
- js-xss (Sanitize untrusted HTML (to prevent XSS) with a configuration specified by a Whitelist. 根據(jù)白名單過(guò)濾HTML(防止XSS攻擊))
- DOMPurify (DOMPurify is a DOM-only, super-fast, uber-tolerant XSS sanitizer for HTML, MathML and SVG.)
Log
- log (Console.log with style)
- console.image (The one thing Chrome Dev Tools didn't need.)
RegExp
- regexr (RegExr is a HTML/JS based tool for creating, testing, and learning about Regular Expressions)
- JSVerbalExpressions (Create regular expressions using chained methods)
- regulex (JavaScript Regular Expression Parser & Visualizer)
- xregexp (Extended JavaScript regular expressions)
- regexpbuilderjs (Create regular expressions using chained methods)
Media
播放器或CSS3媒體查詢
- video.js (open source HTML5 & Flash video player)
- muplayer (An open source web audio player from Baidu Music, support HTML5 and Flash engine on different platforms(百度音樂(lè)播放內(nèi)核))
- clappr (An extensible media player for the web)
- mediaelement (HTML5
- matchMedia.js (matchMedia polyfill for testing media queries in JS)
Voice Command
- annyang (A javascript library for adding voice commands to your site, using speech recognition)
- voicechat (VoiceChat is a set of APIs to create conference rooms on the fly to be used in the browser. Its built using the Plivo WebSDK and APIs)
API
- jscapture (Screen recording and capturing with pure client-side JavaScript.)
- brocco (在瀏覽器在將源碼和注釋抽離顯示在兩側(cè),方便閱覽)
Vision Detection
- tracking.js (A modern approach for Computer Vision on the web :+1:)
- jsfeat (JavaScript Computer Vision library)
Code Highlighting
- highlight.js (Javascript syntax highlighter)
Loading Status
加載狀態(tài)指示器庫(kù),一般用于Ajax請(qǐng)求時(shí)
- nprogress (For slim progress bars like on YouTube, Medium, etc)
- spin.js (A spinning activity indicator)
- progress.js (ProgressJs is a JavaScript and CSS3 library which help developers to create and manage progress bar for every objects on the page.)
- progressbar.js (Beautiful and responsive progress bars)
- bootstrap-progressbar (progressbar interactions for twitter bootstrap 2 & 3 :+1:)
- Ladda (Buttons with built-in loading indicators)
- is-loading (Simple jQuery plugin to show visual feedback when loading data or any action that would take time)
- GridLoadingEffects (Some inspiration for loading effects of grid items using CSS animations.)
- flipload (Flipping elements and show a loading indicator easily.)
- jquery-loading-overlay (jQuery Loading Overlay Plugin)
Lazy Load
延遲(異步)加載資源,提高頁(yè)面訪問(wèn)速度
- echo (Lazy-loading images with data-* attributes)
- jquery_lazyload (jQuery plugin for lazy loading images)
- lazysizes (High performance lazy loader for images (responsive and normal), iframes and scripts, that detects any visibility changes triggered through user interaction, CSS or JavaScript without configuration.)
- basket.js (A script and resource loader for caching & loading files with localStorage)
- text (An AMD loader plugin for loading text resources)
- eCSSential (An experiment in optimized loading of mobile-first responsive CSS)
Validation
- jquery-validation ?(成熟的jQuery表單驗(yàn)證插件)
- Parsley.js (Validate your forms, frontend, without writing a single line of javascript)
- bootstrapvalidator ?(基于Twitter Bootstrap的表單驗(yàn)證)
- validator.js (String validation and sanitization)
- h5Validate (An HTML5 form validation plugin for jQuery)
- jqBootstrapValidation (A JQuery validation framework for bootstrap forms)
Keyboard Wrappers
鍵盤(pán)事件
- mousetrap (Simple library for handling keyboard shortcuts in Javascript)
- jquery.hotkeys (jquery.hotkeys plugin lets you easily add and remove handlers for keyboard events anywhere in your code supporting almost any key combination. It takes one line of code to bind/unbind a hot key combination)
- KeyboardJS (A JavaScript library for binding keyboard combos without the pain of key codes and key combo conflicts)
鍵盤(pán)UI
- Keyboard (Virtual Keyboard using jQuery UI)
Tours And Guides
- bootstrap-tour (Quick and easy product tours with Twitter Bootstrap Popovers)
- hopscotch (A framework to make it easy for developers to add product tours to their pages)
- jquery-tourbus (A jQuery tour/walkthrough plugin)
- shepherd (Guide your users through a tour of your app #hubspot-open-source)
Notifications
- toastr (Simple javascript toast notifications)
Sliders
- unslider (最簡(jiǎn)單的jQuery滑塊插件)
- slick (the last carousel you'll ever need)
- Ideal-Image-Slider (Quite simply the ideal Image Slider in vanilla JS.)
- jquery.smoothState.js (A jQuery plugin to stop the jank of page loads.)
- bxslider-4 (Responsive jQuery content slider)
- slider (Bootstrap Javascript jQuery Carousel/Slider/Slideshow/Gallery/Banner Responsive Image :+1:)
Range Sliders
- ion.rangeSlider (jQuery only range slider)
- bootstrap-slider ?(bootstrap范圍滑塊)
- jQRangeSlider (A jquery UI range selection slider that supports dates)
- rangeslider.js (HTML5 input range slider element polyfill)
- noUiSlider (輕量級(jí)的jQuery范圍滑塊插件,支持大多數(shù)設(shè)備的touch事件,包括IOS, Android, Windows 8 和 Windows Phone 8)
Form Widgets
select 下拉選擇框架
- select2 ?- 支持搜索、遠(yuǎn)程數(shù)據(jù)訪問(wèn)、無(wú)限下拉滾動(dòng) :ok_hand:
- jquery.selectBoxIt.js ?- 兼容移動(dòng)端的、bootstrap風(fēng)格的jQuery選擇框插件,Wonderful!
- multi-select ?- 一個(gè)替換標(biāo)準(zhǔn)選擇框的、用戶友好的多屬性添加與移除選擇框
- bootstrap-select ?- 基于Twitter Bootstrap的下拉選擇框
- selectize.js ?- 個(gè)基于jQuery的自定義select UI 控件,具有自動(dòng)完成、類似原生選擇框的鍵盤(pán)導(dǎo)航及較好的用戶體驗(yàn)
-
bootstrap-multiselect
?- 基于Bootstrap的
多選下拉框
jQuery插件
input 文本輸入框自動(dòng)完成
- visualsearch ?- 增強(qiáng)的、可自動(dòng)完成的搜索框jQuery插件
- typeahead.js ?- is a fast and fully-featured autocomplete library
- floatlabels.js ?- Follows the famous Float Label Pattern. Built on jQuery.
輸入框掩碼
- jQuery-Mask-Plugin ?- 表單字段和頁(yè)面元素掩碼jQuery插件
- formatter.js ?- Format html inputs to match a specified pattern
- jquery.inputmask ?- jQuery Input Mask plugin
- intl-tel-input ?- 輸入和驗(yàn)證國(guó)際電話號(hào)碼的jQuery插件
標(biāo)簽管理
- bootstrap-tagsinput ?- 基于Twitter Bootstrap的可編輯標(biāo)簽jQuery插件)
- tagmanager ?- A jQuery plugin (working nicely with twitter bootstrap)
按鈕
- Ladda ?- Buttons with built-in loading indicators.
Tooltips
- qTip2 (Pretty powerful tooltips)
- tipsy (Facebook-style tooltips plugin for jQuery)
- tooltipster (A jQuery tooltip plugin)
- toolbar (A tooltip style toolbar jQuery plugin :+1:)
- jquery-powertip (A jQuery plugin that creates hover tooltips)
- cssarrowplease (生成工具提示箭頭CSS類)
- jquery-validation-bootstrap-tooltip (A drop in extension replacing error labels from jQuery Validation plugin with Twitter Bootstrap tooltips)
Positioning
- tether (A positioning engine to make overlays, tooltips and dropdowns better)
- fixto (A jQuery plugin for sticky positioning)
- position (Position Utility)
- fixed-sticky (A position: sticky polyfill that works with filamentgroup/fixed-fixed for a safer position:fixed fallback)
Modals and Popups
- jBox ?(強(qiáng)大靈活的彈窗、消息提示、通知...jQuery插件 :clap:)
- flippant.js (一個(gè)迷你、依賴少的DOM節(jié)點(diǎn)翻轉(zhuǎn)UI庫(kù) :+1: )
- sweetalert (A beautiful replacement for JavaScript's "alert")
- bootstrap-sweetalert (Bootstrap implementation)
- noty (noty is a jQuery plugin that makes it easy to create alert - success - error - warning - information - b messages as an alternative the standard alert dialog. Each notification is added to a queue.)
- alertify.js
Scroll
- scrollup ?(創(chuàng)建自定義“回到頂部”的jQuery插件)
- jquery.scrollTo
- jquery.nicescroll (類似iphone/ipad的滾動(dòng)條)
- jQuery-slimScroll ?(可以把任何Div轉(zhuǎn)換成帶漂亮滾動(dòng)條的可滾動(dòng)區(qū)域)
- nanoScrollerJS (同上)
- antiscroll (OS X Lion style cross-browser native scrolling on the web that gets out of the way.)
- skrollr (Stand-alone parallax scrolling library for mobile (Android + iOS) and desktop. No jQuery. Just plain JavaScript (and some love))
- onepage-scroll (Create an Apple-like one page scroller website (iPhone 5S website) with One Page Scroll plugin)
- smooth-scroll (A simple vanilla JS script to animate scrolling to anchor links.)
- reveal.js (The HTML Presentation Framework)
- scrollReveal.js (Easily reveal elements as they enter the viewport.)
視差滾動(dòng)
- parallax (Parallax Engine that reacts to the orientation of a smart device)
- jQuery-Parallax (Used to recreate the Nike Better World parallax effect)
- Parallaxjs (A Library for Javascript that allows easy page parallaxing)
Table/Grid
- jquery-dynatable ?(A more-fun, semantic, alternative to datatables:thumbsup:)
- grid (Drag and drop library for two-dimensional, resizable and responsive lists)
Pagination
- jquery-bootpag (boostrap dynamic pagination jQuery plugin)
Editable
- x-editable (In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery :thumbsup:)
Sortable
- html5sortable (Lightweight jQuery plugin to create sortable lists and grids using native HTML5 drag and drop API.)
Chart
- echarts ?(來(lái)自百度的直觀,生動(dòng),可交互,可個(gè)性化定制的數(shù)據(jù)可視化圖表庫(kù) :thumbsup:)
- peity (Progressive <svg> pie, donut, bar and line charts)
- morris.js (Pretty time-series line graphs)
- jquery.sparkline (A plugin for the jQuery javascript library to generate small sparkline charts directly in the browser)
- morris.js (漂亮、簡(jiǎn)單的折線圖)
WebGL
- MathBox.js (WebGL數(shù)學(xué)圖形庫(kù))
Graphics Library
- raphael (JavaScript Vector Library)
- AlloyImage (基于HTML5的專業(yè)級(jí)圖像處理開(kāi)源引擎)
- d3 (A JavaScript visualization library for HTML and SVG.)
- lazy-line-painter (A JQUERY PLUGIN FOR SVG PATH ANIMATION)
- SVG-Morpheus (實(shí)現(xiàn)SVG圖標(biāo)變形成另外一個(gè)SVG 圖標(biāo)的過(guò)渡效果的JavaScript庫(kù),借鑒了Material風(fēng)格的過(guò)渡效果 :+1:)
- obelisk.js ?(Obelisk.js是個(gè)非??岬腏S庫(kù),它本質(zhì)上是一個(gè)創(chuàng)建等距對(duì)象的JavaScript引擎)
Images
- holder ?- 客戶端圖片占位器
Menu
- jQuery-menu-aim (用于電商網(wǎng)站的多級(jí)商品菜單)
- jQuery.mmenu ?(The best jQuery plugin for app look-alike on- and off-canvas menus with sliding submenus for your website and webapp.)
- jQuery-contextMenu (contextMenu manager)
- metisMenu (Easy menu jQuery plugin for Twitter Bootstrap 3)
- toc (根據(jù)頁(yè)面內(nèi)容生成目錄的jQuery插件)
- jquery.tocify.js (Bootstrap風(fēng)格的目錄jQuery插件)
Background
- Vide (視頻背景效果Jquery插件)
- jquery-backstretch ?(動(dòng)態(tài)伸縮頁(yè)面元素、幻燈片式輪播背景圖片)
Effects Widgets
- jquery.pin (將任意頁(yè)面元素“釘”在某個(gè)容器頂部,而且在尺寸小的屏幕上能夠自動(dòng)禁用這種效果)
- stickUp (讓頁(yè)面目標(biāo)元素 “固定” 在瀏覽器窗口的頂部)
- headroom.js (為頁(yè)面頂部多留些空間。在不需要頁(yè)頭時(shí)將其隱藏)
- fullPage.js ?(fullPage plugin by Alvaro Trigo. Create full screen pages fast and simple)
- jquery-focuspoint (jQuery plugin for 'responsive cropping'. Dynamically crop images to fill available space without cutting out the image's subject. Great for full-screen images.)
- shine.js (A library for pretty shadows.)
- real-shadow (Module that casts photorealistic shadows)
- gif.js (JavaScript GIF encoding library)
- jquery-collagePlus (Create an image gallery like Google+ Albums)
- zoom.js (zoom in on any element in the DOM)
- Blur.js (blur.js is a jQuery plugin that produces psuedo-transparent blurred elements over other elements.)
- tip_cards (Create a card layout that let your user flip through it like you see on Google Tips)
- purplecoat.js (Simple Labeled Overlays)
- textillate (A simple plugin for CSS3 text animations :+1:)
- focusable (Set a spotlight focus on DOM element adding a overlay layer to the rest of the page)
Navigation
- intro.js (A better way for new feature introduction and step-by-step users guide for your website and project.)
- navgoco (Multi-level slide navigation with session storage and accordion effect for JQuery)
- TinyNav.js (Responsive navigation plugin that weighs just 443 bytes)
- flexnav (A jQuery plugin for responsive menus)
- jquery-steps (A powerful jQuery wizard plugin that supports accessibility and HTML5.)
- intro.js (以一種更好的方式展示新特性,非常適合用于在你的網(wǎng)站或項(xiàng)目上一步一步引導(dǎo)用戶)
Responsive
- Respond (A fast & lightweight polyfill for min/max-width CSS3 Media Queries (for IE 6-8, and more))
- responsive-nav.js (Responsive navigation plugin without library dependencies and with fast touch screen support.)
Drag Drop
- dropzone (簡(jiǎn)單地拖放庫(kù),支持圖片預(yù)覽,有好看的進(jìn)度條。)
- jquery.pep.js (Pep, a lightweight plugin for kinetic drag on mobile/desktop)
- jquery-filedrop (drag and drop desktop files and POST to a URL to handle files)
- Bootstrap-Form-Builder (Web app for drag drop building bootstrap forms)
- formbuilder (Formbuilder is a small graphical interface for letting users build their own webforms)
- dragdealer (Drag-based JavaScript component, embracing endless UI solutions)
- Nestable (可拖拽的層級(jí)列表,兼容移動(dòng)端touch的jQuery插件)
Gallery
- Bootstrap-Image-Gallery ( 漂亮的Bootstrap相冊(cè))
Material
- material (Material design for Angular)
Hand-drawing Animation
- vivus (JavaScript library to make drawing animation on SVG)
- walkway (An easy way to animate simple SVG elements.)
Animations
- jQuery-Animate-Enhanced (Extend $.animate() to detect CSS transitions for Webkit, Mozilla, IE>=10 and Opera and convert animations automatically.)
- sprite.js (An efficient javascript sprite animation framework)
Other Resources
- idiomatic.js ?(書(shū)寫(xiě)具備一致風(fēng)格、通俗易懂 JavaScript 的原則)
- javascript-patterns
- [html5-boilerplate] ( https://github.com/h5bp/html5-boilerplate )(一套專業(yè)的前端模版,用以開(kāi)發(fā)快速、健壯、適應(yīng)性強(qiáng)的app或網(wǎng)站)
- angularjs-book (Examples and Code snippets from the AngularJS O'Reilly book)
CSS
- CSS
- bootstrap ?(簡(jiǎn)潔、直觀、強(qiáng)悍的前端開(kāi)發(fā)框架,讓web開(kāi)發(fā)更迅速、簡(jiǎn)單:thumbsup:)
- uikit ?(輕量級(jí)和模塊化的前端框架,快速開(kāi)發(fā)web程序)
- Semantic-UI (語(yǔ)義化設(shè)計(jì)的前端框架,為攻城師而制作的可復(fù)用的開(kāi)源前端框架)
- amazeui ?(中國(guó)首個(gè)開(kāi)源 HTML5 跨屏前端框架)
- switchery ?(IOS7風(fēng)格的checkbox)
- animate.css ?(簡(jiǎn)單的、跨瀏覽器的CSS動(dòng)畫(huà)庫(kù))
- Buttons (A CSS button library built using Sass and Compass)
- bootstrap-switch (Turn checkboxes and radio buttons in toggle switches. :+1:)
- iCheck (Highly customizable checkboxes and radio buttons (jQuery & Zepto) )
- messenger (Growl-style alerts and messages for your app. #hubspot-open-source)
- css3patterns (The popular CSS3 patterns gallery)
- 960-Grid-System (The 960 Grid System is an effort to streamline web development workflow.)
- SubtlePatterns (All the patterns)
- colors (Smarter defaults for colors on the web. )
- ratchet (Build mobile apps with simple HTML, CSS, and JS components. )
- colour-schemes (Colour schemes for a variety of editors created by Dayle Rees. )
- bootswatch (Themes for Bootstrap)
- ionicons (The premium icon font for Ionic Framework)
- bootstrap-material-design (Material design theme for Bootstrap 3)
- HoverEffectIdeas (Some inspiration and modern ideas for subtle hover effects.)
- dashboards (Responsive dashboard templates for Bootstrap)
- flipboard-layout (An experimental page layout that let's you navigate pages by swiping or dragging as in a booklet, inspired by Flipboard.)
- textillate (A simple plugin for CSS3 text animations)
- magic (CSS3 Animations with special effects)
博客園的排版實(shí)在搞不定,請(qǐng)見(jiàn)諒。大家的排版為什么那么漂亮,有什么好的教程嗎?
更多文章、技術(shù)交流、商務(wù)合作、聯(lián)系博主
微信掃碼或搜索:z360901061

微信掃一掃加我為好友
QQ號(hào)聯(lián)系: 360901061
您的支持是博主寫(xiě)作最大的動(dòng)力,如果您喜歡我的文章,感覺(jué)我的文章對(duì)您有幫助,請(qǐng)用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點(diǎn)擊下面給點(diǎn)支持吧,站長(zhǎng)非常感激您!手機(jī)微信長(zhǎng)按不能支付解決辦法:請(qǐng)將微信支付二維碼保存到相冊(cè),切換到微信,然后點(diǎn)擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對(duì)您有幫助就好】元
