Frontend Development（一份巨大的前端开发资源清单）
Looking for something else? Take a look at the awesome collection of other awesome lists.
Guides
- Bento: a collection of guides for web development.
- Hack Design: An easy to follow design course for people who do amazing things.
- Designer School: A group of passionate professionals teaching web development
- Web Style Guide - 3rd Edition covers all the elements from CSS and typography to HTML and the structure of prose.
- Talks To Help You Become A Better Front-End Engineer In 2013
- Web Development Teaching Materials: This site hosts a variety of CC-licensed web development curriculum which was designed to be taught, but it may be useful to students as well.
- Learn HTML5, CSS3, and Responsive WebSite Design in One Go
- Codecademy: Learn to code interactively, for free.
- Codeschool teaches web technologies in the comfort of your browser with video lessons, coding challenges, and screencasts.
- TheExpressiveWeb: This site by Adobe is a resource and showcase of some of the newest, and most expressive features being added to the web today.
- Treehouse: Learn HTML, CSS, iPhone apps and more.
- General Assembly Dash: Learn HTML, CSS, and Javascript through fun projects you do in your browser.
Architecture
- Web Components: the component model for the Web.
BEM: Methodology aimed at achieving fast to develop long-lived projects, team scalability, and code reuse.
Polymer Project: Polymer is a library that uses the latest web technologies to let you create custom HTML elements.
- Flux is the application architecture that Facebook uses for building client-side web applications.
- Aura is an event-driven architecture for developing scalable applications using reusable widgets (discontinued in favor of Web Components).
- Hydra is an easy-to-use framework that provides you with the necessary tools to create scalable applications using modules and widgets.
- Terrific.js provides you a Scalable JavaScript Architecture, that helps you to modularize your jQuery/Zepto Code in a very intuitive and natural way
- Patterns For Large-Scale JavaScript Application Architecture
- Building Single-Page Apps
- Video: Nicholas Zakas: Scalable JavaScript Application Architecture
- Book: Learning JavaScript Design Patterns
- Book: Single page apps in depth
- Book: Scalable and Modular Architecture for CSS
- PDF: jQuery Application Architecture Chart
- How To Manage Large jQuery Apps
- Comparison between different Observer Pattern implementations
- The media object saves hundreds of lines of code
Workflow
- Yeoman is a robust and opinionated set of tools, libraries, and a workflow that can help developers quickly build beautiful, compelling web apps.
Grunt is a task-based command line build tool for JavaScript projects.
- Web development is getting complex. Let's go shopping.
- GruntStart: A Grunt-enabled head-start with the H5BP, jQuery, Modernizr, and Respond. The building blocks to quickly get started with Grunt to create an optimized website.
- A beginner’s guide to Grunt
- Grunt - Synchronised Testing Between Browsers/Devices
Gulp is a build system that makes use of node's streams.
- Mod is a task-based workflow tooling for web, it help developers quickly build robust and high-performance web applications.
- Brunch is an assembler for HTML5 applications. It‘s agnostic to frameworks, libraries, programming, stylesheet & templating languages and backend technology.
- FIS: A front-end integrated solution which included automation tool, development framework, development environment
- Roots A light, super fast, and intuitive build system meant for rapid advanced front end development.
- Sparky.js is a client-side application scaffold which helps those who want to have organized structure in their app, but don't want to subscribe to a particular client-side MVC framework.
- Mimosa is a batteries included modern web development toolkit. Bower, RequireJS, Transpilers, Pre-Processors, Micro-Templating, Linting, Optimization, Serving. To start.
- Automaton: Task automation tool built in JavaScript.
- Cartero: A modular client side asset manager.
Front-end Process - Flat Builds and Automation
- CSSCSS: A CSS redundancy analyzer that analyzes redundancy.
- Helium: JavaScript tool to scan your site and show unused CSS.
- JSLint for detecting errors or problems by static analysis of JavaScript programs.
- JSHint for more flexible static analysis of JavaScript programs.
- JSLint Error Explanations for explanations of the warnings given by JSLint and JSHint.
- ImageOptim-CLI: Make lossless optimisation of images part of your automated build process.
- jpegoptim: Utility to optimize/compress JPEG files.
- Pngcrush is an optimizer for PNG (Portable Network Graphics) files.
- Glue is a simple command line tool to generate CSS sprites.
- Wraith is a screenshot comparison tool.
- Penthouse: Critical path CSS generator.
- Browser-sync: is a tool to sync all input, scrolling, and clicking across all the devices in your testing workflow.
- Video: JavaScript Development Workflow of 2013 by Paul Irish + Slides
Podcasts
- Shoptalk Show A podcast about web design, development and UX.
- Javascript Jabber A podcast all about Javascript
- The Big Web Show A podcast about all things web hosted by Jeffrey Zeldman
- The Web Ahead A weekly podcast about changing technologies and the future of the web
- SassCast A podcast all about the Sass preprocessor.
- CDNify The CDNify podcast covers all things tech, startup, web performance and acceleration.
- The Non Breaking Space Show
Weekly & Daily Resources
- HTML5 Weekly
- HTML5 Bookmarks
- CSS Weekly
- JavaScript Weekly
- Sidebar.io The 5 best design links, everyday
- Web Design Weekly
- Open Web Platform Daily Digest
- Responsive Design Newsletter
- echo.js: Reddit-like Website for JavaScript Resources
- Web Tools Weekly
- A Drip of JavaScript
- ng-newsletter: The free, weekly newsletter of the best AngularJS content on the web.
Programming & Markup Languages
CSS
JavaScript
- Book: Eloquent JavaScript
- Book: Speaking JavaScript
- JavaScript Study Guide
- JavaScript Closures
- OOP In JavaScript: What You NEED to Know
- Prototypes and Inheritance in JavaScript
- ECMA 262-3 in detail
- JavaScript Garden
- Google JavaScript Style Guide
- Github JavaScript Styleguide
- Wordpress JavaScript Coding Standards
- Structure and Interpretation of Computer Programs
Extensions
- RubyJS is a JavaScript implementation of all methods from Ruby classes like Array, String, Numbers, Time and more.
- Mout is a collection of modular JavaScript utilities that can be used in the browser as AMD modules or on node.js (without any overhead).
- bacon.js: A small functional reactive programming lib for JavaScript.
Flow Control
- Coroutine Event Loops in JavaScript
- How To Node Article on promises describing both sides: node.js and browser
- Video by Douglas Crockford on monads which is touching Promises
- Не надо давать обещания, или Promises наоборот
- Promises are the monad of asynchronous programming
- A Study on Solving Callbacks with JavaScript Generators
- What's The Point Of Promises?
- Promises/A+ Spec
- Callbacks vs Coroutines
- This document is intended to explain how promises work
- Video: Monads and Gonads (YUIConf Evening Keynote)
Libraries
- Standalone-Deferred
- Standalone-Deferred
- Flowy
- Step
- kew is a lightweight promise library optimized for node.js
- jQuery Timing
- RSVP.js
- q
- Watch.js
- flow.js
HTML
Higher Level Languages
- Dart: Typed language compiled to JavaScript. By Google.
Sass is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It’s translated to well-formatted, standard CSS using the command line tool or a web-framework plugin.
- Bourbon: A simple and lightweight mixin library for Sass.
- Less extends CSS with dynamic behavior such as variables, mixins, operations and functions.
- Roole is a language that compiles to CSS.
- Stylus: Expressive, dynamic, robust CSS
- TypeScript is a typed superset of JavaScript that compiles to plain JavaScript (by Microsoft)
- CoffeeScript is a little language that compiles into JavaScript.
Frameworks
JavaScript
- Choosing a framework
- Github
Learning
- AngularJS-Learning: huge list of Angular learning resources
- AngularJS Screencasts
- Building Huuuuuge Apps with AngularJS
- What are the nuances of scope prototypal / prototypical inheritance in AngularJS?
- AngularJS from Basics to Dependency Injection
- AngularJS To Do List App
- AngularJS vs Ember
- The Hitchhiker’s Guide to the Directive
- Frontend Workflows with Grunt and Angular JS
- Angular Tips
Integration
- angular-requirejs-seed: this is a fork of Angular Seed but with changes needed for requireJS support.
- Writing Reusable AngularJS Components with Bower
- Native AngularJS directives for Twitter's Bootstrap.
- Automating AngularJS With Yeoman, Grunt & Bower
- Optimizing Angular Templates with Grunt on Heroku
- Building Offline Applications With AngularJS and PouchDB
- Github
- Book: Developing Backbone.js Applications
- Unsuck your backbone
- A Visual Guide to Marionette.js Views
- Building a Backbone.js app tutorial series.
- Migrating an existing app to Backbone
- Chaplin.js: An architecture for JavaScript applications using the Backbone.js library.
Meteor: An open-source platform for building top-quality web apps in a fraction of the time.
Zepto.js: A minimalist JavaScript library for modern browsers with a largely jQuery-compatible API.
- Github
- Zepto Builder Generate a custom version of Zepto that just includes the modules you need
Minified.js: Minified.js is a client-side JavaScript library, comparable to jQuery and MooTools in scope. Its features include DOM manipulation, animation, events, cookies and HTTP requests.
React by Facebook
- Qooxdoo is a universal JavaScript framework for building rich, interactive application, native-like apps for mobile devices, light-weight single-page oriented web applications or even applications to run outside the browser.
- jQWidgets is jQuery based framework and set of widgets for building web-based applications that work on PC, Touch and Mobile devices
- Flight is an event-driven web framework, from Twitter
- Singool.js Lightweight JavaScript framework for developing single-page web applications
- Knockout: Simplify dynamic JavaScript UIs by applying the Model-View-View Model (MVVM) pattern
- rAppid.js: a declarative (XAML) Rich Internet Application JavaScript MVC Framework
- Sammy.js is a tiny JavaScript framework developed to ease the pain and provide a basic structure for developing JavaScript applications.
Ember.js: A framework for creating ambitious web applications.
- Github
Building an Ember.js application Walkthrough of the framework by Tom Dale, one the devs.
- EmberWatch Lots of learning ressources
- Let’s Learn Ember - A free Tut+ Premium course
- Maria: The MVC framework for JavaScript applications. The real MVC. The Smalltalk MVC. The Gang of Four MVC.
- Terrific Composer is a Frontend Development Framework specifically designed for building deluxe frontends based on the Terrific concept
- Rivets.js: Lightweight and powerful data binding + templating solution for building modern web applications.
- Synapse: Data Binding For The Rest Of Us
- Cappuccino: An open source framework that makes it easy to build desktop-caliber applications that run in a web browser.
- A Comprehensive Collection Of JavaScript Application Frameworks
- JavaScript Data Binding Frameworks
- Underscore.js
CSS
- A collection of best frameworks
Bootstrap
- Home Page
- GitHub
- Bootstrap Expo
- Bootstrap Hero List: The big badass list of bootstrap resources
Widgets
- Bootstrap video player - jQuery plugin: A customizable HTML5 video player plugin for jQuery based on bootstrap UI.
- Color and Date Picker
- WYSIHTML5 RTE for Bootstrap
- Bootstrap Image Gallery
- Pines Notify: JavaScript notifications for Bootstrap or jQuery UI.
- fuelUX: Fuel UX extends Twitter Bootstrap with additional lightweight JavaScript controls.
- A date range picker for Twitter Bootstrap
- Bootbox.js: alert, confirm and flexible dialogs for Twitter's Bootstrap framework
- Time Picker
- Date/Time Picker
- ReCaptcha
- Bootstrap Modal: Extends Bootstrap's native modals to provide additional functionality.
- SelectBoxIt
- File Upload
- BootPag: BootPag - dynamic pagination jQuery plugin for twitter bootstrap
- Bootstrap Arrows: A simple jQuery plugin and add-on to the popular Twitter Bootstrap framework to include the use of arrows at any angle in your UI designs.
- X-editable: In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
- Pagination
- Slider
- Application Wizard
Themes
- Bootswatch: Theme catalog.
- Bootstrap Zero: Get a less Bootstrap-y look with these custom themes
- Jumpstart UI: Another catalog for paid themes
- Themestrap: A simple starter kit for constructing Twitter Bootstrap 3+ themes.
- Darkstrap: A dark theme.
- jQuery Mobile Boostrap: A jQuery Mobile theme based on Twitter Bootstrap
- Wrapbootstrap
- Flat UIFree Web User Interface Kit that Rocks!
Wordpress
- CSS3 Microsoft Modern Buttons
- BootMetro: Metro style web framework
- Cosmo: Windows 8 inspired theme
- Inspiritas
- Google+
- Flatstrap
- Pinstrap
Misc
- Boilerstrap: A blank slate for the modern web. Just add creativity.
- Bootstrap GUI PSD: a toolkit designed to kickstart webdesign of webapps and sites.
- Typo3 Extension
- Bootstrap CDN Free CDN for Twitter Bootstrap
- Bootstrap Tour Quick and easy way to build your product tours with Twitter Bootstrap Popovers.
- Bootsnipp: Design elements and code snippets for Bootstrap HTML/CSS/JS framework
- Form Builder
- PaintStrap: Generate beautiful Twitter Bootstrap themes using the Adobe kuler / COLOURlovers color scheme
- TODC: A Google-styled theme for Twitter Bootstrap.
- Layoutit!
- IceCream: Simple and light responsive grid system.
- Responsive Grid System
- Responsive Grid System (2)
- Golden Grid System
- Compass: An open-source CSS Authoring Framework.
- Pondasee: Front-end starter kit combined with the power of SCSS & Compass.
- Centurion: A responsive web framework that scales with your device.
Foundation by Zurb: The most advanced responsive front-end framework in the world.
+ [Foundation 3 Documentation](http://foundation.zurb.com/old-docs/f3/) + [Foundation 4 Documentation](http://foundation.zurb.com/docs/) + [Stylus based port](https://github.com/blai/foundation)- Gumby
- ProfoundGrid
- GroundworkCSS 2: A responsive HTML5, CSS & Javascript framework created and maintained by Gary Hepting
- skelJS
- Ink: Ink is a set of tools for quick development of web interfaces.
- neat: A lightweight semantic grid framework for Sass and Bourbon.
- Kube
- rwdgrid
- Simple Grid
- One% CSS Grid
- Workless
- inuit.css - a powerful, scalable, Sass-based, BEM, OOCSS framework.
- Kraken is a lightweight, mobile-first boilerplate for front-end web developers.
- Axis - clean Stylus-based foundation to build your styles upon
- Jeet next gen responsive grid
- Susy - Responsive grids for Compass
- Pure - Minimal, flat, responsive CSS modules.
- Topcoat is a CSS library evolved from the Adobe design language developed for Brackets, Edge Reflow, and feedback from the PhoneGap app developer community.
- Cascade Framework - a powerful, scalable and responsive high performance OOCSS framework that supports both old and new browsers
- Cascade Framework Light - Cascade Framework stripped down to the bare essentials, for when a minimal footprint is more important than bells and whistles
- Semantic UI empowers designers and developers by creating a language for sharing UI.
Cross Browser
- Normalize.css
- HTML5 Cross Browser Polyfills
- Viewport Component
- Can I Use - Compatibility tables for support of HTML5, CSS3, SVG and more in desktop and mobile browsers.
- HTML5 Please - Collective recommendations for polyfills and implementation of HTML5 and CSS3 features.
- Outdated Browser - Checks if user's browser is outdated and suggests downloading latest.
Cross Device
Responsive
- Responsive Boilerplate: A starting point to responsive web design!
- Video: Responsive Design Workflow by Stephen Hay + Slides
- Responsinator
- How to make a Responsive Newspaper-like layout
- The State Of Responsive Web Design
- Am I responsive?
Tables
Events
Images
- Fluid Images
- How to Use Responsive Images to Make Your Site Shine on Any Platform
- Adaptive Images
- Why We Need Responsive Images
- Riloadr: A cross-browser framework-independent responsive images loader.
- jQuery Picture
- Picturefill
- Clown Car Technique for Responsive Images
- imgLiquid jQuery plugin to resize images to fit in a container.
- PictureFill
- HiSRC: A simple jQuery plugin for adaptive images in responsive web design
- resrc.it: Responsive images on demand from the cloud.
Text
- FitText: A jQuery plugin for inflating web type
- Out Of Words!: The responsive typography framework behind Words App
- Responsive Font Sizing: Making your font size respond to your screen size, easy & maintainable.
- Responsive Measure
E-Mail
- Responsive Email Design: A great guide to create Responsive Email Design
- Responsive Email Templates: Some responsive templates for email
- Ink by Zurb: An awesome responsive email framework from the folks at Zurb.
- HTML Email Boilerplate
- CSS Support in Email
- Email Template Reference
Mobile
Frameworks
- jQuery Mobile: Touch-Optimized Web Framework for Smartphones & Tablets
- jQTouch is a Zepto/jQuery plugin for mobile web development on the iPhone, Android, iPod Touch, and other forward-thinking devices.
- Junior
Emulators
Scrolling
- jSwipeKinetic is a jQuery plugin that enables you to add kinetic scrolling on your touch optimized projects. jSwipeKinetic is build on top of jGestures (jgestues.codeplex.com).
- jQuery.pep.js: A lightweight plugin for kinetic-drag on mobile/desktop.
- Overscroll is a jQuery plug-in that mimics the iphone/ipad scrolling experience in a browser.
- Zynga Scroller
- pull-to-refresh.js
- Overthrow
- Antiscroll
- iscroll
- JScrollPane is a jQuery plugin by Kelvin Luck which converts a browser's default scrollbars (on elements with a relevant overflow property) into an HTML structure.
Gestures
- jGestures jQuery plugin enables you to add gesture events such as ‘pinch’, ‘rotate’, ‘swipe’, ‘tap’ and ‘orientationchange’ just like native jQuery events.
- hammer.js is a focused, standalone JavaScript library, only for multi-touch gestures.
- Touchy: is a highly configurable jQuery plugin. It exposes event data (velocity, etc.) for longpress, drag, pinch, rotate and swipe.
- TouchSwipe
- TipTap
- jQuery.event.swipe
- toe.js is a tiny library based on jQuery to enable sophisticated gestures on touch devices.
- Jester
- JS Touch Layer
- Touch Events and Abstractions
DOM Objects Manipulation
Tap Acceleration
- Energize
- Tappable is a simple, standalone library to invoke the tap event for touch-friendly web browsers.
- Fastclick is a simple, easy-to-use library for eliminating the 300ms delay between a physical tap and the firing of a click event on mobile browsers.
- Lightning Touch
- Creating Fast Buttons for Mobile Web Applications
Layout
- Screensizes
- Snap.js A JavaScript Library for creating beautiful mobile shelfs in JavaScript (Facebook and Path style side menus)
- Flickable.js allows you to make any element touchable; useful for flicking between sections, or sliding elements around the page.
- PageSlide is a jQuery plugin which slides a webpage over to reveal an additional interaction pane.
- Swipe is a lightweight mobile slider with 1:1 touch movement, resistant bounds, scroll prevention, and completely library agnostic.
- Swiper: Mobile touch slider with hardware accelerated transitions.
- jQuery Mobile Pagination Plugin
- SwipeSlide: A Zepto Plugin for iOS like swipe navigation.
- stackable.js is an invaluable jQuery plugin that stacks your tables for small screens. It’s a huge advantage in terms of usability on mobile devices.
Reacting to Device Sensors
- lenticular.js is a jQuery plugin for creating image animations that response to tilting or mouse events.
- This End Up: Using Device Orientation
iOS
- Safari Image Delivery Best Practices
- Safari Graphics, Media, and Visual Effects Coding How-To's
- Safari CSS Visual Effects Guide
- Safari Web Content Guide
- Getting Started with iOS Web Apps
- The iPad Web Design & Development Toolbox
- Targeting the iPhone 4 Retina Display with CSS3 Media Queries
- How do I lock the orientation to portrait mode in a iPhone Web Application?
- jQuery Retina Display Plugin
- retina.js
- Retina Images
Printers
Patterns & Snippets
- Responsive Patterns
- CSS3 Code Snippets
- The Blueprints are a collection of basic and minimal website concepts, components, plugins and layouts with minimal style for easy adaption and usage, or simply for inspiration.
Typography
- Quick guide to webfonts via @font-face
- How To Achieve Cross-Browser @font-face Support
- Google Fonts
Adobe Edge Web Fonts: Get started with free web fonts.
- Typekit: easy way to use commercial web font on your site.
- Matrix of fonts bundled with Mac and Windows operating systems, Microsoft Office and Adobe Creative Suite
- Typeset.css
- typecast
- CSSTypography
- SO: @font-face fonts only work on their own domain
- FitText: A jQuery plugin for inflating web type
- TypeButter
- slabText
- Baseline.js
- jKerny
- Lettering.js
- Trunk8 is an intelligent text truncation plugin to jQuery. It will cut off just enough text to prevent it from spilling over
- bacon is a jQuery plugin that allows you to wrap text around a bezier curve or a line.
- CSS Typography cheat sheet: Small roundup on CSS features that will enhance your web typography.
- Font Squirrel Webfont Generator
Services (Free & Commercial)
- TheToolbox
- colourco
- Color Scheme Designer: find resonate colors for a great design.
- Adobe Kuler: create and share color schemes.
- HTML Entity Character Lookup
- SpritePad
- Responsinator
- HTML Shell
- Form Builder
- Zen BG
- What Font Is identifies fonts from an image.
- Prepros
- Browser Shots tests compatibility in almost every browser.
- CSSArrowPlease Simple tooltip arrows with CSS
- jsFiddle
- CodePen is an HTML, CSS, and JavaScript code editor right in your browser with instant previews of the code you see and write.
- site44 turns Dropbox folders to websites
- Backlift: Work in your Dropbox using your favorite editor. When you save your files, your website will automatically refresh.
- Smush.it uses optimization techniques specific to image format to remove unnecessary bytes from image files.
- JPEGmini Photo Server is an image optimization server which runs on Amazon EC2 (commercial).
- TinyPNG: Advanced lossy compression for PNG images that preserves full alpha transparency.
- GenyMotion is the next generation of the AndroVM open source project, already trusted by 900,000 developers.
Animation
- Velocity.js: Re-implementation of jQuery's $.animate() that adds 20x the speed while also drastically improving the UI animation workflow.
- Animo.js: A powerful little tool for managing CSS animations
- Stylie
- animate.less, is a bunch of cool, fun, and cross-browser animations converted into LESS for you to use in your Bootstrap projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.
- Canvas Advanced Animation Toolkit is an scene graph director-based animation framework for javascript based in the concept of a timeline.
- tween.js: Super simple, fast and easy to use tweening engine which incorporates optimised Robert Penner's equations.
- Janis is a lightweight JavaScript framework that provides simple animations via CSS transitions for modern browsers on the web as well as mobile devices.
- Rekapi: A keyframe animation library for JavaScript
- CanvasScript3 is a JavaScript library for the new HTML5 Canvas with an interface similar to ActionScript3. This library enables Sprite Groups, Layers, Mouse Events, Keyboard Events, Bitmap Effects, Tween Animations etc.
- Shifty is a tweening engine built in JavaScript. It is designed to fit any number of tweening needs.
- emile.js is a no-frills stand-alone CSS animation JavaScript framework.
- Firmin: a JavaScript animation library using CSS transforms and transitions.
- Keanu is a micro-lib for animation on Canvas/JS.
- jsAnim is a powerful, yet easy to use library for adding impressive animations to websites, without sacrificing standards or accessibility. Weighing in at just under 25 kilobytes, jsAnim packs a lot of punch for such a little application.
GreenSock Animation Platform is a suite of tools for scripted animation.
- Learning Resources
- Examples
- Codepen Repository: Codepen repository with examples of Greensock usage and code
- scripty2 is an open source JavaScript framework for advanced HTML-based user interfaces. Or simply put, scripty2 helps you build a more delicious web.
- Animator.js: JavaScript animation library.
- Processing.js: is the sister project of the popular Processing visual programming language, designed for the web. Processing.js makes your data visualizations, digital art, interactive animations, educational graphs, video games, etc. work using web standards and without any plug-ins.
- jQuery Transit: Super-smooth CSS3 transformations and transitions for jQuery.
- Move.js is a small JavaScript library making CSS3 backed animation extremely simple and elegant.
- Collie is a JavaScript library that helps to create highly optimized animations and games using HTML 5.
- Year Of Moo: Angular.js Animations
- animate.css is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.
- Approach
- Magic is a CSS3 framework with many animations, it's simple to use and many animations are cross-browser compatible.
Widgets
Kits
- AlloyUI
- Kendo UI
- jQuery UI Bootstrap: Bootstrap theme for jQuery UI
- jQuery Bootstrap: Integration of Bootstrap and jQuery UI
- Cascade Framework: high performance widgets allow you to define the UI status directly in the DOM
- Zebra: JavaScript library that follows easy OOP concept, provides HTML5 Canvas based Rich UI and includes Java to JavaScript converter tool
File Upload
Sitemap
Table Of Contents
Modals
Notifications
Gallery Sliders
Pagination
Selects
- jQuery Recurrence Input
- Select2
- jquery.selectable.js
- chosen is a library for making long, unwieldy select boxes more friendly.
Progress Bars
Trees
Navigation
Tooltips
Misc
- jQuery Knob
- DopelessRotate
- jQuery Addresspicker
- Fangle: create interactive documents from plain text.
- Skeucard progressively enhances credit card inputs to provide a skeuomorphic interface.
Visualization
- Photon
- CSS3 shapes
- Morris.js
- Cube
- Cubism.js
- Crossfilter
- Datavisualization.ch
- jQuery.Gantt
- easy pie chart
- JointJS JavaScript Diagramming Library
- Gauge.js
- Google Chart Tools
- Piecon
- Viskit.js
- jStat
- CHAP Links Library
- bonsai
- Smoothie Charts
- DataMaps
- mxgraph
- Paper.js is an open source vector graphics scripting framework that runs on top of the HTML5 Canvas.
- Timeline.js: A Storytelling Timeline built in JavaScript.
- xCharts is a JS library for creating attractive, custom data-driven chart visualizations. It uses HTML, CSS, and SVG to create dynamic, fluid charts that can be easily customized and integrated.
- jQuery Gantt editor
- amCharts is a robust charting tool that will suit any dataviz need.
- Responsive vertical timeline
- Raphael.js Easy vector graphics for the web.
- three.js JavaScript 3D library.
- Highcharts: Interactive JavaScript Charts for your web projects.
- Flot: Attractive JavaScript plotting for jQuery
- Chart.js: Easy, object oriented client side graphs for designers and developers
- GoJS: Library for creating interactive diagrams (Trees, flowcharts, state charts, etc) in the browser.
- JointJS is a modern HTML 5 JavaScript library for visualization and interaction with diagrams and graphs.
Validation & Forms
- Mention.js Lightweight wrapper for adding @user mention functionality to Twitter Bootstraps Typeahead plugin
- ALAJAX
- Parsley.js: Validate your forms, frontend, without writing a single line of javascript!
- mailcheck.js: A jQuery plugin that suggests a right domain when your users misspell it in an email address.
- one-validation is a collection of regular expressions for general validation purposes.
- nextVal is an easy-to-use, flexible and robust form validation plugin for jQuery.
- Fields.js creates collections of fields. Each field is constantly evaluated for validity, and is accessible through the collection.
- IV.js was created to provide a intutive way to provide validation filters that are useful in processing user input.
- Ladda: A UI concept which merges loading indicators into the action that invoked them.
- jQuery Super Labels
- jQuery Validation Engine: jQuery validation engine is a JavaScript plugin aimed at the validation of form fields in the browser
Transitions
Numbers
- numeral.js: A javascript library for formatting and manipulating numbers.
- accounting.js
- numbers.js
Time and Dates
Search
- [Fullproof](http://reyesr
评论已关闭