8500+ Best jQuery Plugins & Tutorials with jQuery Demo examples 2019

Pagify.js : A jQuery plugin for single page web sites

July 10, 2012 | Plugins, Web

Effortlessly create single page web sites with this jQuery plugin.Pagify is a simple jQuery plugin that simply replaces the contents of a div with content from other html files.

Features:

Simple – include pagify.js, create a div, make one jQuery call and you’re done!
Lightweight – pagify.js is far less than 100 lines of code, well commented and easy to understand and extend!
Flexible – Get started by only specifying a list of pages or customize animations, default pages and caching!
Fast – Load all pages upfront or load on the fly; a simple $.get() is used to get content with minimal proccessing!
Clean – Replace long HTML files broken up into sections and verbose JS to do the simple task of switching content!
Couldn’t find an adjective… – Uses only Javascript and HTML so it can be uploaded like any other static site!

Read More Demo

jPageFlipper : jQuery HTML5 Canvas page flipper

July 10, 2012 | HTML5, Plugins

This is a wonderful implementation of page flipper entirely based on HTML 5 <canvas> tag. It means that it can work in any browser that supports HTML 5 standard draft – just out of the box!

Read More Demo

Image Tagging Tutorial Using jQuery and CSS

July 10, 2012 | CSS2 / CSS3.0, Web

There is a popular saying that a picture is worth a thousand words. Images are a great way of catching our attention instantly. But sometimes its necessary to tag or link specific parts of images to provide information. Popular social media giants like Facebook and Google Plus use image tagging to identify the people and places in images.

In this tutorial I am going to show you how to create a simple image tagging system using jQuery and CSS.

Read More Demo

An HTML5 Slideshow w/ Canvas & jQuery

July 8, 2012 | CSS2 / CSS3.0, HTML5, Slider

You’ve probably heard a lot about the new HTML5 canvas element. As the name implies, this is a special element that allows us to create and modify graphics. In addition, we can also use it like any other element on the page – apply jQuery animations on it, listen for events and integrate it deeply into our layouts.

All uses of canvas you’ve come so far are probably limited to games and other proof of concept demos. Today, however, we are doing something practical – we are making a progressively enhanced slideshow with a fancy transitioning effect, which is perfectly functional in older browsers as well.

With JavaScript, we are going to apply a special filter to every image in the slideshow. We will create a new version of the images, with higher contrast and more vivid colors, and store it in a canvas elements.

Read More Demo

Coding a Guided Registration Form with jQuery

July 8, 2012 | CSS2 / CSS3.0, Forms, HTML5

Techniques for building a usable registration form can be a major factor towards bringing in new users. When you’ve got an overly complicated form it can scare away so many first time visitors. But a great technique for keeping these people around is coding form hints into the layout.

In this tutorial I want to demonstrate how we can build such an interface with CSS3 and jQuery. We can embed hidden form tips which only display when the user has focused on a particular field. These hints can be used to denote syntax, such as the required length of usernames or passwords. But it’s a great usability tactic which livens.

Read More Demo

Style Your Site According to the Weather with jQuery

July 8, 2012 | Web

By pulling in feed from the Yahoo API with jQuery, you can style your website according to the Weather! Find out how by following this step by step guide. We’ll start by creating four backgrounds for sun, rain, snow and cloudy, then use a clever jQuery script to pull in the forecast. To finish things off, we’ll even create a cool manual override, allowing users to switch through the various themes themselves.

Read More Demo

jShowOff: a jQuery Content Rotator

July 7, 2012 | Gallery, Plugins, Slider

jShowOff is a jQuery plugin for creating a rotating content module. It works by creating ‘slides’ from the child elements (eg. <li>) inside a specified wrapper element (eg. <ul>) on which .jshowoff() is invoked. It then rotates through the slides, with options for controls, links, and more. This type of module is often used to promote pages, sections, or features on a site.

Read More Demo

Mousetrap : Keyboard shortcuts in Javascript

July 7, 2012 | Core Java Script, Events, Plugins

A simple library for handling keyboard shortcuts in Javascript.Mousetrap is a standalone library with no external dependencies. It weighs in at around 1.4kb minified and gzipped.Any keyboard event that has been bound can be triggered by passing in the string you used when you bound it originally.Note that this is not actually triggering a key event in the browser. It is simply firing the event you bound to that key within mousetrap

The feature was inspired by Gmail. Any keys separated by a space will be considered a sequence. If you type each key in order the final one in the sequence will trigger the callback. If you type a key not in the sequence or wait too long the sequence will reset.Any key events that would normally fire for keys within a sequence will not fire if they are pressed within the context of that sequence.

Read More Demo

jQuery Facebook Traffic Driver

July 7, 2012 | Plugins, Premium

This plugin will take your Facebook presence to new heights. Its elegant look and real time stats will make people feel like they are making a difference. Aside from the real time data stream, the like status is stored in a cookie so you have the option of enforcing the user to “like” you before they can access content. You can also set a timer on the popup to show for an set period of time before it hides itself.

Read More Demo

cssFx : Inserts vendor prefixes for CSS3 properties

July 7, 2012 | Core Java Script, CSS2 / CSS3.0

CssFx : Insert verdor prefixes for css3 properties

cssFx is a standalone polyfill that inserts the vendor-specific CSS3 properties necessary for old and new browsers. This saves you tons of time, maintenance, and bandwidth!

Supported features :

Box shadows, border radius, multiple columns, border image, RGBA, transforms, keyframes, transitions (and properties inside transitions), flexible box, gradients, and a ton of other useful things (like opacity, ellipsis, and inline-block).

Read More Demo

jQuery Plugins Tags