This article was published 10 years ago, therefore the contents of this post may be out of date.

jQuery is one of the well-known JavaScript library in the web development industry as they are really handy and you always will find great plugins for anything. Sometimes it hard to keep your toolkit of jQuery plugins updated with the latest trends to create some amazing websites. So today’s post features 12 New & Awesome jQuery plugins that the jQuery community have been working on everyday to store in your toolkit.

1. Swipebox

swipebox

Swipebox is a jQuery lightbox plugin that’s been optimised for both mobile and desktop devices using swipe gestures for mobile and keyboard navigation for desktop. This plugin supports CSS transitions with jQuery fallback, retina support for UI icons. It’s compatible with modern desktop and mobile browsers, including IE8 and up, iOS 4+, Android, Windows Phone and more.

2. Maskify

maskify

MaskifySlider is an extremely simple jQuery plugin that which enables you to create an image slider with the effect of an image mask. The plugin will automatically offset the images position according to the spacing between their placeholders, giving the impression that it’s only one masked image.

3. jAutochecklist

jautochecklist

jAutochecklist is a jQuery plugin that help you to create an user-friendly HTML list which can be used to replace the old tradition select list

4. Gallerie

gallerie

Gallerie is a jQuery plugin that offers a basic lightbox-like gallery viewer of a collection of images. It features a simple overlay with a scrollable thumbnail list, image loading hint, as well as an image caption and index. The overlay thumbnails automatically scroll with the user’s mouse and can be activated by click or custom event. Several methods exist to allow for extending the plugin with richer functionality through javascript.

5. hColumns

hColumns

hColumns is a jQuery plugin that looks like Mac OS X Finder’s column view for the hierarchical data.

6. Shapeshift

shapeshift

Inspired heavily by the jQuery Masonry plugin the Shapeshift jQuery plugin will dynamically arrange a collection of elements into a column grid system similar to Pinterest. What sets it apart is the ability to drag and drop items within the grid while still maintaining a logical index position for each item. This allows for the grid to be rendered exactly the same every time Shapeshift is used, as long as the child elements are in the correct order.

7. Chardin

chardin

Chardin.js is a jQuery plugin that creates a simple overlay to display instructions on existent elements. This plugin was inspired by the recent Gmail new composer tour.

8. flickrBomb

flickr-bombs

flickrBomb by Zurb provides an easy way for you to fill your prototypes with relevant content, and not just those dull gray placeholder images.

9. VerticalShift

VerticalShift

VerticalShift is a jQuery plugin which allows a row of elements to be condensed to fit within a parent element. This will allows more objects in a smaller space, yet providing an easy way view all the objects and with a simple mouse hover over the element it will enlarged to show its full content.

10. jBinder

jBinder

jBinder is a jQuery plugin that makes it easy to use unobtrusive JavaScript using the HTML5 data attribute to allow DOM elements to specify the functions they should trigger. Rather than  the traditional approach of having JavaScript matching elements by id or by class name jBinder allows events to be bound using the attribute data-jbinder-functions; therefore keeping the css free for what it is there for styling.

11. Photoset Grid

photoset-grid

The Photoset Grid is a simple jQuery plugin to arrange images into a flexible grid, based on Tumblr’s photoset feature. Originally the plugin was created for our Style Hatch Tumblr themes as a way to use the photoset grid in responsive layouts.

12. Retinise

retinise-js

Retinise.js is a really simple jQuery plugin which ‘retinises’ your inline images, and because it uses ‘data-src’ instead of ‘src’ it means it only ever serves up the image you need, saving you and your users bandwidth. This plugin is really small and really easy to use.

Share

12 New & Awesome jQuery Plugins For Web Developers