The 50 Most Useful jQuery Plugins for Frontend Development

There many other JavaScript frameworks available, but jQuery is clearly the most popular (according to BuiltWith, it’s currently used by over 78% of top million sites). The purpose of jQuery is to make many of those JavaScript functions that typically need many lines of code easier to manage and write by bundling them into methods that can be called upon with just a single line of code. It’s lightweight, and because it is extendable, there are jQuery plugins freely available for almost every functionality you can think of.

Just to help you find exactly what you are looking quickly, we have classified all of the jQuery plugins into the following categories: Web & Mobile Layouts Plugins, Menu & Navigation Plugins, Plugins for Media, Slider, Carousel & Gallery Plugins, Text Effect Plugins, Form Plugins, and finally a bunch of uncategorized Utility Plugins.

jQuery Plugins for Web & Mobile Layouts

pagePiling.js is a jQuery plugin for ‘piling’ your layout sections over one another and accessing them by scrolling.

fullPage.js is a simple plugin for creating fullscreen scrolling websites.

The jQuery Tilted Page Scroll allows you to create a beautilful and unique 3D tilted scrolling effect on your website.

gridscrolling.js is a plugin for positioning sections and asides in a grid & allowing for easy cursor key navigation.

Flickerplate is a responsive, touch-enabled and lightweight plugin that allows you to ‘flick’ through content.

jInvertScroll is a lightweight plugin that allows you to move horizontally with a parallax effect while scrolling down.

Animsition is a simple plugin for adding page transitions with CSS animations.

scrollToBySpeed.js is a plugin that let’s you scroll the window by speed rather than by duration.

Brick Work is a lightweight (15kb) and feature-rich plugin for creating responsive dynamic layouts.

ScrollMe is a lightweight plugin that allows you to add simple scrolling effects to webpages.

jquery.smoothState.js is a plugin that progressively enhances pages to behave more like a single-page application.

multiscroll.js is a simple plugin for creating multi scrolling websites with two vertical scrolling panels.

jquery.matchHeight.js is a more robust equal heights plugin for jQuery.

jQuery Navigation & Menu Plugins

Slidebars is a lightweight (2kb) plugin for creating an app-style push-menu.

scotchPanels.js is a jQuery off-canvas menu and panel plugin.

jQuery Plugins for Media (Images & Video)

Focuspoint is a plugin for dynamically cropping images to fill the available space without cutting-out the image’s subject.

Fluidbox is a replication of the Medium.com lightbox module, with some added improvements.

GifPlayer is a small plugin that allows you to control when to play and stop animated GIFs.

rowGrid.js is a plugin for placing images on a grid with support for infinte scrolling.

SVGMagic is a simple SVG fallback plugin that finds SVG images on your site and creates PNG versions if the browser doesn’t support them.

Vide is a jQuery plugin for easily adding video backgrounds to your webpages.

Dense.js is a plugin for easily serving retina-ready images.

Covervid is a simple plugin that will allow you to make HTML5 video behave like a background image.

jQuery-Cropbox is a really useful plugin for in-place image cropping (zoom & pan, as opposed to select and drag).

Face Detection is a powerful jQuery/Zepto plugin that detects faces on images, videos and canvases.

BttrLazyLoading is a plugin that allows your web app to only load images within the viewport as the user scrolls.

jQuery Slider, Carousel & Gallery Plugins

Simple jQuery Slider is a lightweight jQuery Slider that does exactly what a slider should do: ‘slides slides’.

FSVS is a simple fullscreen vertical slider using CSS3 transitions with jQuery fallback.

anoFlow is a feature-rich and responsive lightbox/gallery plugin.

nanoGALLERY is a responsive, touch-enabled and easy to use image gallery plugin.

Justified.js is a plugin that creates a justified image grid of images.

Shuffle Images is a jQuery plugin that allows you to display and shuffle multiple images within a gallery by moving or shaking the cursor.

Skippr is a super simple and lightweight slideshow plugin for jQuery.

jQuery Text Effect Plugins

jQuery.fontFlex.js is a lightweight plugin for dynamically changing font sizes.

t.js is a lightweight jQuery plugin for typewriter-like text effects.

CurvedText is a simple jQuery plugin that allows you to align text on any curve.

Morphext – An Animate.css powered jQuery carousel plugin for text phrases.

Splitchar is a jQuery plugin that allows you to style and design the first, second or both halves of a character.

jQuery Form Element Plugins

BootstrapValidator is a jQuery plugin for validating Bootstrap forms.

Labelauty – A nice and lightweight jQuery plugin that gives beauty to checkboxes and radio buttons.

Guardian is a flexible and easy to extend all-purpose form validation jQuery plugin.

fontIconPicker is a lightweight plugin that allows you to include a simple icon picker (with search and pagination) within any form.

HideSeek is a simple, yet customizable jQuery plugin for live search.

ClockPicker is a clock-style timepicker for jQuery or Bootstrap.

jQuery Utility Plugins

jQuery Confirm Mailto is a plugin to Confirm with users before opening any mailto: link through their default email client.

jNottery is a plugin that allows you to add notes to a page.

Responsive Tabs is a plugin that offers responsive tab functionality.

jquery.adaptive-backgrounds.js is a cool plugin that extracts the dominant color from the images on your web page and applies the color to their parent.

…and finally…

jQuery.planetarium is a jQuery plugin that allows you to construct interactive planets and build the Universe!

table-dragger – Easily add drag-and-drop sorting to your table without jQuery.

Selector – A micro JavaScript library used as a replacement for jQuery, weighing in at nearly 5KB.

jquery.wanker.js is a humourous jQuery plugin that reveals a public service announcement when people start excessively resizing their desktop browser as they try to see your responsive breakpoints. As they say ‘The web is meant to be read, not squished!’

Finished!