The 50 Most Useful jQuery Plugins from 2011

What an exciting web development year we have had (OK, its not quite finished, but almost). HTML5 and CSS3 have forced there way into the mainstream, responsive layouts techniques are rapidly moving towards being the standard, sites like Dribble, Forrst and GitHub have offered a fantastic platform to both inspire and share new ideas and solutions, and of course, as it always reliably does year after year, the jQuery plugin community has released a colossal amount of really, really useful plugins.

With this post we have highlighted the 50 jQuery plugins that, we feel, are not only the most useful and popular from the this year, but also the most ground-breaking. To help you find a specific solution, we have split all of the plugins into the following categories: Form & Validation Plugins, Plugins for Responsive Layouts, Sliders, Galleries & Carousels, Modal Window Plugins, Mobile Specific Plugins, Web Typography Plugins, Animation Plugins and finally everything in-between.

You might also like to view the 50 most useful plugins from 2014, 2013, or 2012.

If you feel we have missed any plugins, please do share them in the comments below.

Form & Validation Plugins


Recurly.js lets you create secure, PCI compliant transaction forms with fully customizable CSS.

Ideal Forms

Ideal Forms is a small framework to build powerful and beautiful online forms.

In-Field Labels

In-Field Labels is a simple plugin that turns properly formatted HTML forms into forms with in-field label support.


Sisyphus lets you create Gmail-like client-side drafts, so when a visitor filling out your form closes the tab/browser and reopens, all the changes are saved and restored.

jQuery Credit Card Format Validation

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. Supports all major credit cards (American Express, Mastercard, Visa, Discover, Diners Club).


MotionCAPTCHA is a jQuery CAPTCHA plugin that requires users to sketch the shape they see in the canvas in order to submit a form.

Power PWChecker

Power PWChecker is a free jQuery plugin to ensure secure passwords for users. This simple jQuery plugin can be integrated seamlessly with any online form to check password strength and give users clues for creating strong and secure passwords.


DropKick lets you painlessly create custom dropdowns. It also degrades gracefully for visitors on older browsers.

TagBox Plugin

TagBox is a jQuery plugin to help add tags like input in your forms.

Plugins for Responsive Layouts

Response Javascript

Response Javascript is a lightweight jQuery plugin that gives web designers tools for building performance-optimized, mobile-first responsive websites. It provides semantic ways to dynamically swap code blocks based on breakpoints and serve media progressively via HTML5 data attributes. Its object methods give developers hooks for triggering responsive actions and booleans for testing responsive properties.


Responsly.js is a set of simple responsive widgets, written using CSS3 transformations and available as a jQuery plugin.


FitVds.js is a lightweight, easy-to-use jQuery plugin for fluid width video embeds.

Dynamic Carousel

Dynamic Carousel is a responsive carousel plugin that works with a responsive/flexible layout, as opposed to many other carousels that are use pixel values instead of percentages and thus have fixed sizes.


Isotope is a jQuery plugin for intelligent, dynamic layouts.


Elastislide is a responsive jQuery carousel that will adapt its size and its behavior in order to work on any screen size. Inserting the carousel’s structure into a container with a fluid width will also make the carousel fluid.


FlexSlider is a fully responsive jQuery slider plugin.
FlexSliderDemo →


Blueberry is a jQuery image slider written specifically to work with fluid/responsive web layouts.

Sliders, Galleries & Carousels

TN3 Gallery

jquery image slider

TN3 Gallery is a fully responsive image gallery which also comes available as a WordPress plugin. There’s a lite version available for free.


Slidorion is a combination of an image slider and an accordion. It displays beautiful images along with a variable length description. With images linked to each tab, and accompanied by a large array of effects, the Slidorion is a great alternative to the traditional jQuery slider.


bxSlider is a jQuery HTML content slider and image slideshow.


Diapo is a free jQuery slideshow plugin. It is an open source project.


Craftyslide is a tiny (just 2kb) slideshow built on jQuery. Craftyslide aims to be different, by providing a simple, no-frills method of displaying images; packaged into a small, clean and efficient plugin.


Minimit Gallery is a highly customizable Jquery plugin that does galleries, slideshows, carousels, slides – practically everything that has multiple states.


Galleria is a JavaScript image gallery framework built on top of the jQuery library. The aim is to simplify the process of creating professional image galleries for the web and mobile devices.

jQuery Image Gallery

Like the name says, this is a simple jQuery image gallery plugin.


rlightbox is a jQuery UI mediabox that can display many types of content such as images, YouTube and Vimeo videos. It has many unique features like Panorama and Live Re-size. Like other jQuery UI widgets, it is ThemeRoller ready.

Circular Content Carousel

This plugin is a circular content carousel. You’ll have some content boxes that can slide infinitely (circular). When clicking on the “more” link, the respective item moves to the left and a content area will slide out. Now you can navigate through the carousel where each step will reveal the next or previous content box with its expanded content. Clicking on the closing cross will slide the expanded content area back in and animate the item to its original position.

HTML5 Music Player

A simple and clean HTML5 music player that’s supported on all major browsers (even IE7 and IE8).

Modal Window Plugins


Reveal is a jQuery modal plugin. You can set up modals in just three easy steps. Attach the needed files, drop in your modal markup then add an attribute to your button.


leanModal is a simple jQuery modal plugin that works with your CSS. You can use it to create sign up forms, basic content modals, and more.

Mobile Specific Plugins


Overscroll is a jQuery plugin that mimics the iPhone/iPad scrolling experience in a browser. The plugin adds a draggable drift to overflowed DOM elements as well as a set of fading ‘thumbs’. Runs on most modern browsers.

jQuery Mobile

jQuery Mobile is a touch-optimized web framework for smartphones and tablets. It has a unified, HTML5-based user interface system for all popular mobile device platforms. IT’s built on the rock-solid jQuery and jQuery UI foundation. It’s lightweight code is built with progressive enhancement, and it has a flexible, easily theme-able design.


PhotoSwipe is a free HTML/CSS/JavaScript based image gallery specifically targeting mobile devices.


jQuery.fracs determines the fraction of an HTML element that is currently in the viewport, as well as the fraction it takes of the complete viewport and the fraction of the area that might possibly be visible. It also provides the coordinates of the visible rectangle in document, element and viewport space.

Web Typography


Lettering.js is a jQuery plugin for radical web typography. It gives you complete down-to-the-letter control of your web type.


FitText is a jQuery plugin for inflating web type. FitText 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.

Shuffle Letters Effect

A short tutorial for making a jQuery plugin that will shuffle the text content of any DOM element – an interesting effect that can be used in headings, logos and slideshows.


The jFontSize plugin was developed to facilitate the process of creating the famous buttons A+ and A-, which alter the font size on sites with very large texts, such as blogs, journals, tutorials, etc. This tool is also used to increase the accessibility of sites, helping people who have visual problems to see better content.

Animation Plugins

jQuery Transit

jQuery Transit creates super-smooth CSS3 transformations and transitions for jQuery.


jRumble is a jQuery plugin that rumbles, vibrates, shakes, and rotates any element you choose. It’s great to use as a hover effect or a way to direct attention to an element.

And… all the rest

jQuery Lifestream

jQuery Lifestream is a plugin that lets you easily create a stream of your online activity.

jQuery ComboGrid Plugin

ComboGrid, like autocomplete, when added to an input field, enables users to quickly find and select from a pre-populated list of values as they type, but in a tabular and paginated manner. ComboGrid provides keyboard navigation support for selecting an item.


grumble.js provides special tooltips without the usual limitations of north/east/south/west positioning.

jQuery Timelinr

jQuery Timelinr is a simple plugin helps you to give more life to the boring timelines. It supports horizontal and vertical layouts, and you can specify parameters for most attributes: speed, transparency, etc.


deck.js is a tool for making modern HTML presentations. Slides are basic HTML. The deck.core module keeps track of slide states and deck states, leaving CSS to define what each state looks like and how to transition between them. Extensions use core events and methods to add goodies, giving presenters the freedom to add what they want and leave out what they don’t.


spin.js is an animated CSS3 loading spinner. You can adjust every single parameter: number of lines, length and width of lines, radius, trail, speed of spinning, and whether there’s a shadow or not.

Ninja UI

Ninja UI is a jQuery plugin enabling beautiful web interface objects efficiently and unobtrusively.


jquip is a stripped down, faster, more modular – include only the parts you want – of jQuery. It is only 4.28KB (minified and gzipped) meaning it is only 13% of jQuerys actual size, yet has 90% of the really useful parts of jQuery (the rest can be added with plugins as needed).
You can also build customizable jquip packages with the new jQuip Library Builder service.


CodeExplorer is an online code explorer that displays code as an entire folder structure. This plugin allows for different themes, multiple instances, fullscreen mode, github connections, and much more.


arbor.js is a graph visualization library using web workers and jQuery.

jQuery Boilerplates

jQuery Boilerplate

As the name says, jQuery Boilerplate is a boilerplate for jump-starting jQuery plugins development. This project won’t seek to provide a perfect solution to every possible pattern, but will attempt to cover a simple template for beginners and above.

jQuery Plugin Boilerplate

jQuery Plugin Boilerplate is another boilerplate for jump-starting jQuery plugins development.

(648 Posts)

Paul Andrew

Paul is the founder and editor of Speckyboy Design Magazine. He has many years experience within the web design industry and a passion for the latest web technologies and design trends. He lives in the small town of Inverness in the north of Scotland. Follow him on Twitter, Facebook or Google+.


  • Captain Kickarse

    Thanks for the selection! The Ideal Forms demo is of real interest to me, thanks.

  • Very helpful. Thanks

  • Mikey Roox

    stop with post list pleaaaase!!! 

  • tommy

    When are people like you going to realize that not everyone else on this earth sees the same webpages and content that they see? If you can’t stand these sort of posts, don’t click on them. It’s as easy as that.

    I happen to enjoy these sort of lists, when starting a new project, I like to look these kind of lists over to get new ideas and to see what is available to me. I see nothing wrong with that.

  • This is so helpful Oleg!
    Few of these didn’t know they exist! I love post lists!!

  • Great Post, thanks a bunch for this. A definite bookmark!!

  • TwentyEleven

    Helpful list, thanks

  • Wow really nice list you have here, I especially like the sliders as I haven’t seen some of them. The modals are also nice one’s which I can use in one of my up coming projects.

  • Cedric Ruiz

    Love the multiple select stuff. I might just steal that idea for my own plugin. I’m hoping to have multiple select and keyboard support for next version.

  • Thanks for posting such an Informative posts for web developers like me  but I am looking into j query auto complete plugin into my web application project. Basically,
    I need to create a product search form that allow the user to quick search
    a product by entering the name of the product OR the sku of the
    product. So, first the user need to select the search type option either
    by Name or by SKU and entering the search criteria on the auto-complete
    text box. When the name / sku is found in the database, a collection of
    the matching product will be populated with the name and sku to be shown
    on the selection box. Is there anyone who can tell me which jquery autocomplete plugin is best to apply in the context. waiting for your reply !

  • Nice one , it’s very useful to me…:-)

  • Another great jQuery roundup. These are awesome. I love to bookmark these and go through them later. Another that I love is s3slider—it’s so versatile!

  • Great list. Have used some of them when developed Jigbo

  • Xakni Domz

    Nice list! Great source for making tutorials!