Best jQuery Events Plugins & Tutorials with Demo

NoFi : Detecting offline States with HTML5

NoFi : Detecting offline States with HTML5

NoFi, for when there’s no WiFi. Uses the native HTML5 API to detect if a user’s internet goes offline and emits a custom offline event for your callbacks.

Finger : jQuery Tap & Gestures event plugin

Finger : jQuery Tap & Gestures event plugin

Finger unifies click and touch events by removing the 300ms delay on touch devices. It also provides a common set of events to handle basic gestures such as flick, drag, press and double tap.
Very small (< 0.5kb gzipped), it is focused on performance and KISS, is well tested and also supports jQuery delegated events.

CSS animation event JavaScript library

CSS animation event JavaScript library

Cross browser compatible library to handle CSS3 animation and transition DOM events with a fallback pattern for unsupported browsers.For browsers that don’t support CSS3 animation or transition, faux end callbacks will be fired by cssanimevent.js.

jQuery Scrollstop : Plugin to fires Events when Scrolling

jQuery Scrollstop : Plugin to fires Events when Scrolling

A jQuery plugin that fires events when scrolling stops and starts.

jQuery.tap : jQuery Click alternative for Touch enabled browsers

jQuery.tap : jQuery Click alternative for Touch enabled browsers

jQuery tap is a jQuery plugin that creates a click alternative for touch enabled browsers.jQuery.tap listens for both touch and mouse events and will use the first event that is fired to detect a tap.

If the browser does not support touch events, then the regular mouse events to create a tap event. No need for if/else statements, jQuery.tap will do that for you.

Tocca.js : Detect via Javascript events on Any Device

Tocca.js : Detect via Javascript events on Any Device

Super lightweight script ( ~1kB ) to detect via Javascript events like ‘tap’ ‘dbltap’ ‘swipeup’ ‘swipedown’ ‘swipeleft’ ‘swiperight’ on any kind of device.

jTap : Tap Event for jQuery

jTap : Tap Event for jQuery

jTap is a additional event for jQuery processing touching to screen on touch devices.Those who are faced with adaptation of web-based applications for mobile devices knows that the event “click” is triggered with a delay of 300ms, observe which not very pleasant. In addition, click on non-delegated place of document will not work. To solve these problems and was designed by jQuery Tap Event.

jQuery Resize End Plugin

jQuery Resize End Plugin

A tiny plugin to handle events after a (window) resize has been completed.

jQuery Ajax StartDelay

jQuery Ajax StartDelay

A small jQuery plugin providing a delay to be set before the handler is called in jQuery’s .ajaxStart().

The .ajaxStart event handler in jQuery calls the handler immediately when the ajaxStart event is triggered. In other words: when the AJAX request is made the handler is called. Most of the time the handler is used to show the user some kind of notice like ‘please wait a minute’ while the AJAX request-response cycle is on its way. It’s annoying to see this notice everytime an AJAX request is made. It’s nicer when this notice only shows up when the request-response cycle takes longer than a few seconds. This plugin provides the functionality to delay the call to the handler.

The plugin is simply a wrapper around the .ajaxStart event handler.

jQuery End Page Box : Displaying a Box at the End of the Page

jQuery End Page Box : Displaying a Box at the End of the Page

In this day and age, we are all competing for attention. The longer people stay on your website and drill down to your content, the better. Today, I have decided to implement a plugin called End Page Box that will let you easily show any dialog when the user scrolls to the bottom (or any range) of the page.

You can use it to recommend other posts on your website, show related posts, or even to annotate the page with extra information which will eventually create a richer and deeper experience for your users.

This plugin will keep track of your scroll location and whenever you scroll to the specified area, the plugin will automatically display the dialog until you go out of range. The animations available are a combination of jQuery for basic animations such as fade and slide, and CSS3 (defined in endpage-box.css) for more complex ones.



Best jQuery websites design awards