50个每一个开发人员应该拥有的JavaScript库，jQuery的和WP插件

目前的网页设计和开发的趋势已经被CSS3和jQuery，HTML5和WordPress的技术进行极大地革新。它们不仅可以构建一个非常漂亮的网站，有很大的知名度，而且还有很多免费的开源库和插件可用。今天我们收集了一些最好的jQuery和WordPress插件，包括不同的功能，如滑块，布局，表单验证，工具提示tooltip，漂亮的表格，排版和音频/视频处理等。

Croppic – Open Source Image Cropping jQuery Plugin

Croppic is an image cropping jquery plugin that will satisfy your needs and much more. Simply upload an image, and then you are able to crop the image as you like with the zooming in and out functionality. It works in IE 10+, chrome, and firefox. It uses FormData so there is no IE9 and prev versions support at the moment.

FFForm – Free jQuery Contact Form Plugin with Validations & Amazing CSS3 Animation

FFForm is a simple jQuery contact form plugin that can be integrated in any website layout to provide a fully functional contact form. Built with jQuery and CSS, FFForm contact form is compatible with all modern web browsers and mobile devices. It also provides various customization options including animations, field validation and notifications.

 AngularJS

AngularJS lets you write client-side web applications as if you had a smarter browser. It lets you use good old HTML (or HAML, Jade and friends!) as your template language and lets you extend HTML’s syntax to express your application’s components clearly and succinctly. It automatically synchronizes data from your UI (view) with your JavaScript objects (model) through 2-way data binding. To help you structure your application better and make it easy to test, AngularJS teaches the browser how to do dependency injection and inversion of control. Oh yeah and it also helps with server-side communication, taming async callbacks with promises and deferreds; and makes client-side navigation and deeplinking with hashbang urls or HTML5 pushState a piece of cake.

A Responsive Multi Level Dropdown Menu Plugin With Icons For WordPress: WPBootM

WPBootM is a responsive multi level dropdown menu plugin for WordPress, based on famous 推ter bootstrap framework it also supports text based icons using font-awesome iconic fonts. All the features of WPBootM plugin are customizable from plugin option page, where you change the menu bar color, menu item color, menu text color, add logo to your menu. Along with image based logo there is an option for text based logo as well.

 SlideMe

A responsive, css3, compatible (works fine even with IE7), customizable, easy to install (and use), multi-instance, fullscreen, cool, powerful slideshow plug-in for jQuery.

Moment.js

A javascript date library for parsing, validating, manipulating, and formatting dates.

Full Screen Responsive jQuery Image and Content Slider:RSlider

RSlider is a full screen responsive image and content slider powered by the fantastic javascript library jQuery. With a nice and simple design it adjusted automatically to the width of your browser screen.

Free Wall

Freewall is a cross-browser and responsive jQuery plugin to help you create many types of grid layouts: flexible layouts, images layouts, nested grid layouts, metro style layouts, pinterest like layouts … with nice CSS3 animation effects and call back events. Freewall is all-in-one solution for creating dynamic grid layouts for desktop, mobile and tablet.

WordPress Image Slider Plugin With Cool Transition Effects: Quake Slider

Powered with WordPress, Quake Image Slider offers variety of options to chose from. You can select different themes for slider, select the effects you like, adjust animation speed, adjust the caption orientation and much more.

Auto Fix Anything

This little plugin will let you automatically fix position of any container on your website with one JS call.

Stylish jQuery Accordion Plugin (FREE): Akordeon

Akordeon is a stylish jQuery plugin for adding efficient accordion style menu to a web page. The idea behind Akordeon is to provide a lightweight and customizable interface for collapsible panels that can hold any kind of data in a limited space.

Akordeon is fully customizable and can be used to display large chunks of data (text, images etc.) in a limited space. For instance, you can use it to display categorized data or menu options just like a restaurant’s menu items with each category data displayed in a separate panel.

Bigfoot

Footnotes on the web are a pain in the ass. You click on a tiny number, get transported somewhere near the bottom of the page, find the footnote you were looking for, and click on a link to go back to where you were on the page.

This script looks to make that whole process painless. It automatically detects the footnote link and content, turns the link into an easy-to-click button, and puts up a popover when the reader clicks on the footnote button.

jQuery Clean and Simple Tooltips: gips

Gips is a clean and simple jQuery plugin and is based on Gips Freebie. Its simple, customizable, and easy to use. It also supports CSS themes.

You can also find a website design company near you and hand over your website design requirements to an expert!

Dropzone

DropzoneJS is an open source library that provides drag’n'drop file uploads with image previews.

Stickup

A simple plugin that “sticks” an element to the top of the browser window while scrolling past it, always keeping it in view. This plugin works on multi-page sites, but has additional features for one-pager layouts. Scroll down to see it in action.

Create a Card Layout that Let Your User Flip Through

Tip Cards plugin let you create a layout of cards with a card-like interaction that you see on Google Tips Page. There are several new animation options so that you can personalize it to your own liking. You can use callbacks to perform actions before or after the modal opens. Modern browsers such as Chrome, Firefox, and Safari on desktop have been tested.

Ion.Sound

Plugin for playing sounds on events.

jQuery Responsive Horizontal Accordion Image Slider: raccordion

raccordion is a multi purpose responsive accordion image slider plugin raccordion. Its a horizontal image slider that adjusts according to the size of the browser width. raccordion slider adds variety and style.

Power Ranger

Tired of BORING number inputs that are hard to see when the numbers are too long? Tired of numbers that are too small inside the box? Add some POWER to your inputs with POWER [input] RANGER! Works great for max/min number inputs, part of the SWEET html5 spec.

XML-driven Vertical News Scroller Script using HTML and jQuery: vScroller

Adding scrolling content to your website or blog makes much sense – it allows you display latest news, promotions, product updates, announcements, upcoming events, calendar items and much more in a limited space. It also allows you to add dynamic content to otherwise static web pages.

vScroller is a free XML-driven vertical news scroller for websites and blogs. Powered by jQuery, vScroller displays categorized and color-code content is a vertical scroll. Feeds come from standardized XML file and styled with simple CSS3 for a clean and attractive interface.

Succinct

Succinct shortens your text to a specified size, and then adds an ellipsis to the end.

Free, Interactive jQuery Plugin for Feedback Collection: Opineo

Built on simple JavaScript and CSS, Opineo is free jQuery plugin for feedback collection by Greepit. It can be easily integrated with any website or application to quickly enable feedback collection.

jQuery Credit Card Validation Plugin: Smart Validate

Smart Validate is a jQuery credit card validation plugin, that makes credit card format validation a simple task. It ensures that user has entered valid credit card number before making actual transaction. Smart Validate supports the following credit cards.

Hammer.js

A JavaScript library for multi-touch gestures.

jQuery Pagination Plugin: Smart Paginator

Smart Paginator is a comprehensive jQuery Pagination plugin that makes adding pagination very simple task, all the navigation logic is built in and it is also very customizable. Smart Paginator jQuery Pagination plugin can also filter your data automatically on client side. Click the screen shot below for the demonstration to see the various filter options provided by Smart Paginator. Smart Paginator supports variety of parameters and custom themes, that can be used to customize the look and feel to your desire.

Circletype.js

Circletype.js is a tiny (2.7kb) jQuery plugin that lets you set type on a circle.

jQuery Broken Link Checker Plugin: jsLink

You have a web site with lots of web pages, each web page contains many images and links to other pages. You want to make sure that all links are working properly. Broken links or dead links leave bad impact on your web site user. To check that all links are working properly you can either check all the links by manually clicking every link or you can use some automatic process. jsLink helps you automatically check the broken links with just one click. jsLink is a broken links checker plugin, that can be easily plugin with in any web page.

Glide.js

Glide is responsive and touch-friendly jQuery slider. Based on CSS3 transitions with fallback to older broswers. It’s simple, lightweight and fast.

jQuery Selectric

Fast, simple and light jQuery plugin to customize HTML selects.

jQuery Spin Button Plugin: Smart Spin

Smart spin is a jQuery spin button plugin that mimics the very common windows spin button control. Smart spin allows you to select a value between minimum and maximum values using either mouse or keyboard. You can also enter a value via keyboard.

Smart spin contains a text box and “up” “down” buttons, it also supports “masking”(text that appears when the control looses focus). Clicking the “up” button causes the value to increment by step value (step value is configurable, default is 1), while clicking the “down” button causes the value to decrement by step value. Clicking up/down buttons and holding the left mouse button causes the values to change more rapidly. Smart Spin now supports mouse wheel button, you can change value using mouse wheel as well.

Alpaca

Alpaca generates forms on-the-fly using JSON schema and configuration to define object models, types, properties, validation logic and layout. Alpaca generates intuitive forms while giving your business the assurance of data compliance.

The Alpaca library is pre-packaged with controls, wizards, layouts, I18N support and pluggable template engines for EJS, Handlerbars and jQuery.tmpl. API Documentation is provided so that you can extend Alpaca as you see fit.

Alpaca helps you to separate your data from your presentation. Design your forms once and have them work across different devices and UI engines without any additional coding.

jQuery Sliding Content Bar Plugin: PushUp Content Bar

It is a smart and quick content bar that you can integrate easily in any website or web application. It is integrated seamlessly in your website and can be popped up whenever required. PushUp Content Bar is easy to customize and strong enough to rely upon. You can add your contact details, location map via Google Maps, and a simple contact form that visitors can use to make contact with you.

Maplace.js

Maplace.js helps you to embed Google Maps into your website, quickly create markers and controls menu for the locations on map.

Slippery

Responsive slider plugin for jQuery. Intrinsic trick to enable responsive resizing without js!

Formatter.js

Sometimes it is useful to format user input as they type. Existing libraries lacked proper functionality / flexibility. Formatter was built from the ground up with no dependencies. There is however a jQuery wrapper version for quick use. It formats user input to match a specified pattern.

Ember.js

Write dramatically less code with Ember’s Handlebars integrated templates that update automatically when the underlying data changes.

jQuery Floating Social Share Plugin: floatShare

If you have not connected your web content with social medial platforms, you are are just a step behind. All you need to do is add floatShare jQuery plugin on your website. It is a free jQuery plugin that allows your website visitors to share your web content on popular social media platforms with a single- click giving you good coverage and audience on multiple social media platforms. floatShare also gauges popularity of your web content by giving you a summary of total ‘shares’ and ‘likes’.

floatShare is easy to integrate and customize. It comes with three different sizes and styles of social buttons. Built on jQuery, floatShare is compatible with all major web browsers and work with mobile devices as well. The social buttons of floarShare have floating behavior – they float with content as visitors scroll up or down the page. floatShare can be customized with different start and end points.

Ace

Ace is an embeddable code editor written in JavaScript. It matches the features and performance of native editors such as Sublime, Vim and TextMate. It can be easily embedded in any web page and JavaScript application.

jQuery Plugin for On-demand Search Box: SeacrhMeme

A free jQuery plugin for on-demand search box. We call it SearchMeme – the idea is to provide a small search button that can be placed anywhere on the website (you may want to put it in your website header). Clicking on search button expands it to show a text box where you can type your search terms.

Reveal.js

A framework for easily creating beautiful presentations using HTML. Reveal.js comes with a broad range of features including nested slides, markdown contents, PDF export, speaker notes and a JavaScript API. It’s best viewed in a browser with support for CSS 3D transforms but fallbacks are available to make sure your presentation can still be viewed elsewhere.

jQuery Animated Bar Plugin: jqBar

jqBar is a simple jQuery plugin for creating animated vertical and horizontal bars. The plugin is called jqBar. jqBar can be used in variety of situations where you want to present data with some visual effects. It helps you crate beautiful bar charts to represent skill set or can be used as a progress bar. Plugin is very light weight and can be completely customized.

Handlebars.js

Handlebars provides the power necessary to let you build semantic templates effectively with no frustration.

Mustache templates are compatible with Handlebars, so you can take a Mustache template, import it into Handlebars, and start taking advantage of the extra Handlebars features.

Bower

Bower is a package manager for the web. It offers a generic, unopinionated solution to the problem of front-end package management, while exposing the package dependency model via an API that can be consumed by a more opinionated build stack. There are no system wide dependencies, no dependencies are shared between different apps, and the dependency tree is flat.

WordPress Tabbed News Slider Plugin: WP Tabbed News

WP Tabbed News is WordPress version of the tNews jQuery news slider plugin. Now you can manage the plugin directly from your WordPress site. With wp-tabbed-news you can display news from different sources, with each tab displaying sliding news for a particular category.

Video.js

The open source HTML5 video player. Style with the same CSS you know and love responsive design and retina displays supported. Built with font icons for easier customization.

Parsley.js – Javascript Forms Validation

Validate your forms, frontend, without writing a single line of JavaScript!

Less.js

Less is a CSS pre-processor, meaning that it extends the CSS language, adding features that allow variables, mixins, functions and many other techniques that allow you to make CSS that is more maintainable, themable and extendable.

Less runs inside Node, in the browser and inside Rhino. There are also many 3rd party tools that allow you to compile your files and watch for changes.

Open Source jQuery PHP Ajax Contact Form Templates With Captcha: Formify

A collection of open source jQuery & PHP ajax contact forms, we call it Formify. Formify is a contribution to lessen the pain of creating contact forms. The collection contains six different forms that are commonly used. These open source contact forms can be customized as well to suit the need for your website/application.

Formify uses PhpMailer for email functionality. PHPMailer is a PHP email transport class featuring file attachments, SMTP servers, CCs, BCCs, HTML messages, word wrap, and more. Sends email via sendmail, PHP mail(), QMail, or directly with SMTP. Go to PhpMailer Wiki if you wan to learn more about PhPMailer class.