85 Best jQuery Plugins for Web Design 2019

Here you will have a look at some best jQuery Plugins that has been shared in 2014.

FlowType.JS

FlowType.JS

Ideally, the most legible typography contains between 45 and 75 characters per line. This is difficult to accomplish for all screen widths with only CSS media-queries. FlowType.JS eases this difficulty by changing the font-size—and subsequently the line-height—based on a specific element’s width. This allows for a perfect character count per line at any screen width.

Website FlowType.JS →

Sticky-Kit

Sticky-Kit

Sticky-kit provides an easy way to attach elements to the page when the user scrolls such that the element is always visible.

Website Sticky-Kit →

Table-to-JSON

Table-to-JSON

A jQuery plugin that converts an HTML Table into a javascript object. Great for working with user-editable tables or accessing output from 3rd party tools.

Website Table-to-JSON →

DropzoneJS

DropzoneJS

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

Website DropzoneJS →

Sly

Sly

JavaScript library for one-directional scrolling with item based navigation support.

Website Sly →

pep

pep

jquery.pep.js is a lightweight jQuery plugin which turns any DOM element into a draggable object. It works across mostly all browsers, from old to new, from touch to click. I built it to serve a need in which jQuery UI’s draggable was not fulfilling, since it didn’t work on touch devices (without some hackery).

Website pep →

S Gallery

S Gallery

The plugin makes use of HTML5’s FullScreen API, and relies heavily on CSS3 animations goodness and CSS3 transforms, so it will work only in browsers that support these features.

Website S Gallery →

slimMenu

slimMenu

slimMenu is a lightweight jQuery plugin, which is made to create responsive and multi-level navigation menus on the fly.

Website slimMenu →

FractionSlider

FractionSlider

FractionSlider is a jQuery plugin for image/text-sliders. It allows you to animate multiple elements per slide. You can set different animation methods like fade or transitions from a certain direction. Also there are options to specify delays and easing for each element. You have full layout and design control through html and css (every html-element can be animated).

Website FractionSlider →

Swipebox

Swipebox

Swipebox is a jQuery “lightbox” plugin for desktop, mobile and tablet.

Website Swipebox →

On Scroll Header Effects

On Scroll Header Effects

You’ve surely seen those really cool on scroll effects for headers that have been around lately. One example is the header on the Riot Industries website by Phil Renaud which rotates in 3d on click and enlarges when scrolling down. Similar work has been done by Johnny Simpson where he explores Scroll Activated Fixed Header Animations.

Website On Scroll Header Effects →

imagefill.js

imagefill.js

The jQuery plugin for making images fill their containers (and be centered).

Website imagefill.js →

jQuery.panelSnap

jQuery.panelSnap

A jQuery plugin that, after scrolling, snaps to blocks of content which I like to call panels.

Website jQuery.panelSnap →

Promin

Promin

Your form requires little modification, so even if JavaScript is turned off or Promin fails to deliver, your form won’t break. I’ve tried several browsers on desktops, tablets and phones. So far, everything seems to work like a charm.

Website Promin →

JWorld

JWorld

JWorld is a JavaScript 3D kit based on CSS3 and HTML5. It can render any HTML5 elements into a 3D view and lets you control the camera and the sprites in the scene. If a camera and a scene is not wanted, there is also a “page” mode to set CSS-3D without any camera or view setup, the page mode is usefull for menu and hover effects like the menu on this page.

Website JWorld →

jQuery Gridly

jQuery Gridly

Gridly is a jQuery plugin to enable dragging and dropping as well as resizing on a grids. In the example below try tapping or dragging any of the bricks.

Website jQuery Gridly →

smint

smint

Smint is a simple jQuery plugin that helps with the navigation on one page style websites. It has 2 main elements, a sticky navigation bar that stays at the top of the page while you scroll down and menu buttons that automatically scroll the page to the section you clicked on.

Website smint →

ScrollIt.js

ScrollIt.js

ScrollIt.js makes it easy to make scrolling pages like this one or add scrolling functionality to existing pages.

Website ScrollIt.js →

CollagePlus

CollagePlus

This plugin for jQuery will arrange your images to fit exactly within a container. You can define the padding between images, give the images css borders and define a target row height.

Website CollagePlus →

jQuery TourBus

jQuery TourBus

It is definitely yet another jQuery tour/walkthrough plugin!

Website jQuery TourBus →

FooTable

FooTable

FooTable is a jQuery plugin that aims to make HTML tables on smaller devices look awesome – No matter how many columns of data you may have in them.

Website FooTable →

Progression.js

Progression.js

A jQuery plugin that gives users real time hints & progress updates as they complete forms.

Website Progression.js →

Draggable Background

Draggable Background

A jQuery plugin to make background images draggable.

Website Draggable Background →

dylay

dylay

A responsive “dynamic layout” jQuery plugin.

Website dylay →

jQuery Age

jQuery Age

Age is a jQuery plugin that formats and tracks dates and times as human readable text.

Website jQuery Age →

jquery-steps

jquery-steps

A powerful jQuery wizard plugin that supports accessibility and HTML5.

Website jquery-steps →

dragend.JS

dragend.JS

a jQuery plugin for content swiping. dragend JS is a swipe plugin for jQuery. It’s open source and uses hammer.js for observing multi-touch gestures.

Website dragend.JS →

TimeTo

TimeTo

jQuery plugin – timer countdown digital clock.

Website TimeTo →

mixitup.io

mixitup.io

MixItUp is a light-weight but powerful jQuery plugin that provides beautiful animated filtering and sorting of categorized and ordered content.

Website mixitup.io →

jquery.swatches

jquery.swatches

This is a jQuery plugin that turns a single div into a sweet color swatch (aka, color pallette).

Website jquery.swatches →

Textillate.js

Textillate.js

Textillate.js combines some awesome libraries to provide an ease-to-use plugin for applying CSS3 animations to any text.

Website Textillate.js →

Mmenu

Mmenu

A jQuery plugin for creating slick, app look-alike sliding menus for you mobile website with only one line of javascript.

Website Mmenu →

Magnific Popup

Magnific Popup

Magnific Popup is a free responsive jQuery lightbox plugin that is focused on performance and providing best experience for user with any device (Zepto.js compatible).

Website Magnific Popup →

Photoset Grid

Photoset Grid

A simple jQuery plugin to arrange images into a flexible grid, based on Tumblr’s photoset feature.

Website Photoset Grid →

FlexNav

FlexNav

A Device Agnostic Approach to Complex Site Navigation with Support for Touch and Keyboard Accessibility.

Website FlexNav →

easy pie chart

easy pie chart

Lightweight jQuery plugin to render and animate nice pie charts with the HTML5 canvas element.

Website easy pie chart →

Sieve

Sieve

Sieve allows you to quickly add an interactive search filter to any block of content.

Website Sieve →

scrollUp

scrollUp

ScrollUp is a lightweight jQuery plugin to create a customisable “Scroll to top” feature that will work with any website, with ease.

Website scrollUp →

Flexisel

Flexisel

Responsive Carousel jQuery Plugin.

Website Flexisel →

FractionSlider

FractionSlider

FractionSlider is a jQuery plugin for image/text-sliders. It allows you to animate multiple elements per slide. You can set different animation methods like fade or transitions from a certain direction. Also there are options to specify delays and easing for each element. You have full layout and design control through html and css (every html-element can be animated).

Website FractionSlider →

jQuery-menu-aim

jQuery-menu-aim

menu-aim is a jQuery plugin for dropdown menus that can differentiate between a user trying hover over a dropdown item vs trying to navigate into a submenu’s contents.

Website jQuery-menu-aim →

Spoiler Alert

Spoiler Alert

Don’t spoil it! Hide copy and images with a bit of SVG blur. Taste on mouseover. Eat on click.

Website Spoiler Alert →

Sidr

Sidr

The best jQuery plugin for creating side menus and the easiest way for doing your menu responsive.

Website Sidr →

Swipebox

Swipebox

Swipebox is a jQuery “lightbox” plugin for desktop, mobile and tablet.

Website Swipebox →

Photoset Grid

Photoset Grid

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.

Website Photoset Grid →

Selecter

Selecter

Replace those boring default select elements with something a little nicer. Selecter also integrates with Scroller, giving you complete control of your project’s UI. Oh, and they play nice with that shiny new responsive layout (try resizing this window).

Website Selecter →

Trip.js

Trip.js

Trip.js,a jQuery plugin for product landing page navigation.

Website Trip.js →

UNheap

UNheap

A tidy repository of jQuery plugins.

Website UNheap →

threesixty

threesixty

a jQuery plugin for creating draggable 360s.

Website threesixty →

Baseline.js

Baseline.js

Baseline.js is a jQuery plugin that helps you to maintain vertical rhythm set by a typographic baseline, even when adding inline images with awkward sizes.

Website Baseline.js →

scrollUp jQuery plugin

scrollUp jQuery plugin

ScrollUp is a lightweight jQuery plugin to create a customisable “Scroll to top” feature that will work with any website, with ease.

Website scrollUp jQuery plugin →

LAZY LINE PAINTER

LAZY LINE PAINTER

The Lazy Line Painter plugin allows you to perform path animations. This means that if you’ve got an image, which consists of lines only (with a start & end, with no fills), then this plugin will allow you to perform an animation which will trace the line to draw the picture – as an animation.

Website LAZY LINE PAINTER →

Toolbar.Js

Toolbar.Js

Toolbar allows you to quickly create tooltip style toolbars for use in web applications and websites. The toolbar is easily customisable using the twitter bootstrap icons and provides flexability around the toolbars display and number of icons.

Website Toolbar.Js →

perfect-scrollbar

perfect-scrollbar

perfect-scrollbar is a tiny jQuery scrollbar plugin for any websites and scrollable region.

Website perfect-scrollbar →

Threesixty-slider

Threesixty-slider

This is a jQuery plugin to create 360 degree product image slider. The plugin is full customizable with number of options provided. The plugin have the power to display images in any angle 360 degrees. This feature can be used successfully in many use cases e.g. on an e-commerce site to help customers look products in detail, from any angle they desire.

Website Threesixty-slider →

Nested

Nested

jQuery Nested plugin for a gap free, multi column grid layout experience.

Website Nested →

barcode

barcode

Jquery plugin to create barcode : datamatrix, ean 8, ean 13, code 128, 2 of 5 interleaved and standard, code 11, code 39, code 93, codabar, msi.

Website barcode →

dropdown.dot.js

dropdown.dot.js

A super-flexible and clean JQuery Dropdown Plugin based on dot.js Templates.

Website dropdown.dot.js →

Motio

Motio

jQuery plugin for simple but powerful sprite based animations and panning.

Website Motio →

Image Picker

Image Picker

Image Picker is a simple jQuery plugin that transforms a select element into a more user friendly graphical interface.

Website Image Picker →

Tooltipster

Tooltipster

A lightweight, flexible jQuery plugin enabling you to easily create semantic, modern tooltips enhanced with the power of CSS.

Website Tooltipster →

ParamQuery

ParamQuery

ParamQuery grid is a lightweight jQuery grid plugin inspired by MS Excel and Google spreadsheet. It’s based upon jQueryUI Widget factory which is an excellent design pattern for UI controls with consistent API.

Website ParamQuery →

scrollNav

scrollNav

scrollNav is a light jQuery plugin that grabs your page’s existing content, divides it up into logical sections and builds a customizable scrolling sidebar navigation. Scroll this page and watch it follow along w/ you.

Website scrollNav →

Flot

Flot

Flot is a pure JavaScript plotting library for jQuery, with a focus on simple usage, attractive looks and interactive features.

Website Flot →

Cycle.js

Cycle.js

Cycle through your content without writing a single line of Javascript. To keep things simple, transition effects are optional and have been limited to slide and cross-fade. In browsers that don’t support CSS transitions, jQuery’s animate is used.

Website Cycle.js →

jquery.cookie

jquery.cookie

A simple, lightweight jQuery plugin for reading, writing and deleting cookies.

Website jquery.cookie →

Flippy

Flippy

Flippy is a cross-browser flip effect plugin for jQuery which allows you to flip whatever html element you want.

Website Flippy →

stalactite

stalactite

A jquery plugin that slowly and lazily packs the contents of an element. Unlike most packing libraries that try to do all the math and sorting up front, stalactite takes a lazy approach and sorts each child element sequentially. This can add a sense of curation as it makes your viewer aware of the browser’s decisions.

Website stalactite →

Conditionizr

Conditionizr

Conditionizr is an intelligent jQuery plugin, that detects the end-users browser and pixel ratio, allowing you to serve specific conditional JavaScript and CSS files they need.

Website Conditionizr →

jQRangeSlider

jQRangeSlider

A powerful slider for selecting value ranges, supporting dates and more.

Website jQRangeSlider →

1 Comments

  1. Tiểu Quansays:

    Freewall plugin

    help you creating flex grid layout

    http://vnjs.net/www/project/freewall/

    https://github.com/kombai/freewall

Leave a Reply to Tiểu Quan Cancel reply

Please be polite. We appreciate that. Your email address will not be published and required fields are marked

This site uses Akismet to reduce spam. Learn how your comment data is processed.