40+ jQuery Plugins to Spice Up your Website

For more than five years, jQuery has been helping to shape the development of the next generation of websites. Today, jQuery is the most popular JavaScript library out there, used by over 30% of all websites on the Internet. Its abstraction and simplification for HTML DOM manipulation, event handing, animation, and AJAX interactions – all bundled into a fast and concise library – has made it the de facto framework for modern web development. However, its plugins are the key elements of the secret sauce that has resulted in jQuery being embraced so overwhelmingly by developers. The plugins provide additional functionality off the back of the jQuery library.

In this month’s featured article, we take a look at more than 40 jQuery plugins that can spice up your website. Our list includes all kinds of plugins to help you enhance different aspects of your site, including form, navigation, media elements, and the overall user interface. The list also includes plugins to simplify working with effects and animations, drag and drop, AJAX, and overlays. Don’t forget to also visit our jQuery Plugins category which showcases over 200 items.

jQuery Form Plugins

Uniform
Uniform is a popular jQuery plugin that applies a consistent skinning to your form elements across all browsers. It does this by masking your standard form controls with custom themed controls. It works in sync with your real form elements to ensure accessibility and compatibility.
 
Recurly.js
Recurly.js is a Javascript library designed to be easily embedded and customized form elements to match your website. The library performs in-line validation, real-time total calculations, and gracefully handles errors.
 
Ajax AutoComplete for jQuery
Ajax Autocomplete for jQuery allows you to easily create autocomplete/autosuggest boxes for text input fields. Built with focus on performance – results for every query are cached and pulled from local cache for the same repeating query.
 
Chosen
Chosen is a JavaScript plugin that makes long, unwieldy select boxes much more user-friendly. It is currently available in both jQuery and Prototype flavors.
 
Validation
Validation is a plugin that makes client-side form validation trivial by offering lots of option for customization. It comes bundled with a useful set of validation methods, including URL and email validation and also includes an API to write your own methods.
 
In-Field Labels
In-Field Labels jQuery Plugin turns properly formatted HTML forms into forms with in-field label support. Labels fade when the field is focussed and disappear when text entry begins. Clearing a field and leaving brings back the label.
 
Power PWChecker
Power PWChecker is simple jQuery plugin can be integrated seamlessly with any online form (sign up form/ user registration form) to check password strength and give users clues for creating strong and secure passwords.
 
Form Wizard
The form wizard plugin is a jQuery plugin which can be used to create wizard like page flows for forms without having to reload the page in between wizard steps. The plugin is unobtrusive and gives the developer great freedom on how they set up the flow of the different steps in their wizards.
 

jQuery Typography Plugins

Lettering.js
Lettering.js brings radical web typography to your content. It does so by wrapping your text with span tags, allowing you to target CSS rules to individual letters, words or sentences.
 
FitText
FitText is a plugin that makes font-sizes flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element.
 
Airport
Airport is a rather simple text effect plugin for Jquery. It emulates the style of those flickering information boards you sometimes find on airports and train stations.
 
SlabText
SlabText is a jQuery plugin for producing big, bold and responsive headline. It does so by splitting your headline into rows and assigning different font-weight to each row.
 

jQuery Content Presentation Plugins

jQuery News Ticker
jQuery News Ticker brings a lightweight and easy to use news ticket to your site. You can set it to load content from an RSS feed or list elements. The speed, direction of text animation and other visual effects can be easily customized.
 
Booklet
Booklet is a jQuery plugin for displaying content on the Web in a flipbook layout. You can place any sort of HTML elements inside of your booklet pages. It supports manual page turning, keyboard navigation and page numbers.
 
turn.js
turn.js is a plugin for jQuery that adds a beautiful transition similar to real pages in a book or magazine for HTML5.
 
jQuery Collapse
jQuery Collapse is a lightweight plugin that enables expanding and collapsing of content blocks. It includes feature like cookie persistence whereby which it will remember what’s visible and what’s not on each visitor’s visits.
 
jPages
jPages is a client-side pagination plugin but it gives you a lot more features comparing to most of the other plugins for this purpose, such as auto page turn, key and scroll browse, showing items with delay and completely customizable navigation panel.
 
Masonry
Masonry is a dynamic grid layout plugin for jQuery. Think of it as the flip-side of CSS floats. Whereas floating arranges elements horizontally then vertically, Masonry arranges elements vertically, positioning each element in the next open spot in the grid. The result minimizes vertical gaps between elements of varying height, just like a mason fitting stones in a wall.
 
PageSlide
PageSlide is a jQuery plugin allows you to add slide interaction to your pages. When clicked, your main viewport will slide to reveal an additional interaction pane. This is pretty handy for revealing sidebar navigation or widgets in a web application.
 

Alert, Tooltip and Notification jQuery Plugins

Slide Note
Slide Note is a jQuery plugin that makes it easy to display sliding notifications on your site or web application. It offers flexible positioning options, support for AJAX, CSS hooks and more.
 
Apprise
Apprise is an alert box plugin that is very simple, fast and attractive. IT gives you complete control over style, content, position and functionality. Apprise is, more or less, for the developer who wants an attractive alert or dialog box without having to download a massive UI framework.
 
qTip2
qTip2 is an advanced tooltip plugin that is user-friendly yet featured rich. It provides you with features like rounded corners, speech bubble tips and is completely free to use under the MIT license.
 

jQuery Video and Audio Plugins

jQuery tubular
jQuery tubular is a plugin that places a YouTube video of your choice into your page as a background. Usage is straightforward and requires JavaScript and the Flash player to be installed and functional on the client’s browser.
 
jPlayer
jPlayer is a free and open source media library written on the top of jQuery. It allows you to rapidly weave cross-platform audio and video into your web pages. It is totally customizable and skinnable using HTML and CSS.
 
FitVids.JS
FitVids.JS is a lightweight and easy-to-use jQuery plugin for fluid width video embeds. It is ideal for responsive web design whereby which the embedded video size will increase or decrease automatically to adjust based on the browser’s size.
 
Speakker
Speakker is a cross-browser audio solution featuring HTML5. It comes out of the box in two variations and with incredible options of customization: Flexible dimensions, unlimited colors and two different button sets for light and dark themes.
 
Buzz
Buzz is a small but powerful Javascript library that allows you to easily take advantage of the new HTML5 audio element. It degrades gracefully on non-modern browsers.
 

jQuery Image Plugins

CloudZoom
CloudZoom allows you to add image zoom functionality to your images when mouse hovered over. You can easily alter the appearance of the smaller image, lens and zoom window through regular CSS.
 
MobilyNotes
MobilyNotes is a lightweight jQuery plugin that shows your images or other HTML content in a stacked manner. You can use it to rotate your images and content.
 
CraftMap
CraftMap is a lightweight, fully configurable jQuery plugin that converts a simple image into a functional map by overlaying dynamic elements on it such as markers. Like Google Maps, you can place your own marker icons and add location information to specific markers with a draggable image interface.
 
NailThumb
NailThumb is a plugin that allows you to create thumbnails easily from high-resolution images, without any distortion, with one line of code only. You can even decide the thumbnail dimensions directly from CSS. It integrates perfectly with any media gallery.
 
Slidorion
Slidorion combines the look of an image slider and an accordion to display beautiful images along with a variable length description. With slides linked to each tab, and accompanied by a large array of effects, the Slidorion is a great alternative to the traditional jQuery slider.
 
Craftyslide
Craftyslide is a tiny (just 2kb) slideshow built on jQuery. It aims to be different, by providing a simple, no-frills method of displaying images; packaged into a small, clean and efficient plugin.
 
Glisse.js
Glisse.js is a simple, responsive and fully customizable jQuery photo viewer. The transitions between the images are handled via CSS3.
 

jQuery Navigation Plugins

Page Scroller
Page Scroller is a simple and elegant navigation plugin that adds smooth scroll functionality to your web page. The plugin is so simple that you can animate any web site.
 
jQuery contextMenu
contextMenu plugin allows you to add context menus to your web application. These can be triggered with right-click, left-click, hover or your own custom trigger events. You can populate your menu dynamically and on-demand and incorporate form input elements within the menu.
 
jQCloud
jQCloud is a jQuery plugin that builds neat and pure HTML + CSS word clouds and tag clouds that are actually shaped like a cloud.
 

jQuery Charts and Timeline

jqPlot
jqPlot is a plotting and charting plugin for the jQuery Javascript framework. jqPlot produces beautiful line, bar and pie charts with many features like automatic trend line computation, tooltips and data point highlighting.
 
Flot
Flot is a pure Javascript plotting library for jQuery. It produces graphical plots of arbitrary datasets on-the-fly client-side. The focus is on simple usage (all settings are optional), attractive looks and interactive features like zooming and mouse tracking.
 
Morris.js
Morris.js is a lightweight library that uses jQuery and Raphaël to make drawing time-series graphs easy.
 
Timeline
Timeline is a jQuery plugin that allows you to easily add interactive timelines to your site. It is also great for pulling in media from different sources. It has built in support for pulling in Tweets and media from Twitter, YouTube, Flickr, Vimeo, Google Maps and SoundCloud. To add events to your timeline, you can populate it using a Google spreadsheet or via JSON.