Best jQuery jQuery UI Plugins & Tutorials with Demo

    JZoopraxiscope : jQuery plugin for making animations from static images

    JZoopraxiscope : jQuery plugin for making animations from static images

    JZoopraxiscope is a jQuery plugin for making animations from static images inspired in Eadweard Muybridge’s Zoopraxiscope.Besides jQuery, it also uses jQuery UI and requires the frames to be animated as a single, horizontal image.It all works by calling a simple function where we define dimensions of the images and the frame.

    After that, JZoopraxiscope works with the help of play and pause buttons provided.Although it looks hard to use the resource widely, with a bit help of creativity, it can beautify a web page easily.

    jQuery Iviewer : Image Viewer plugin with multiple Controls

    jQuery Iviewer : Image Viewer plugin with multiple Controls

    jQuery.iviewer is an jquery ui widget representing image viewer component used to load and view image with ability to zoom image and to drag it with mouse in container.

    CropZoom : jQuery Plugin Select an area of an image and then Crop

    CropZoom : jQuery Plugin Select an area of an image and then Crop

    CropZoom is a plugin that let you select an area of an image and then crop it. whit this tool you also will be able to zoom in or to zoom out, to drag and also rotate an image.

    Hallo.js : In-Place Rich editor for jQuery UI

    Hallo.js : In-Place Rich editor for jQuery UI

    Hallo is a very simple in-place rich text editor for web pages. It uses jQuery UI and the HTML5 contentEditable functionality to edit web content.

    The widget has been written as a simple and liberally licensed editor. It doesn’t aim to replace popular editors like Aloha, but instead to provide a simpler and more reusable option.The Hallo editor operates as a jQuery UI plugin and has been written in CoffeeScript for the sake of simplicity. CoffeeScript is a beautiful little language that compiles into JavaScript.

    jQRangeSlider : jquery UI range selection slider that supports dates

    jQRangeSlider : jquery UI range selection slider that supports dates

    jQRangeSlider is a jquery UI range selection slider that supports dates.

    Features :

    • Select a range of values inside defined bounds.
    • Adjust your selection by moving an end.
    • Move your range as a whole.
    • Move selected range with scrolling arrows.
    • Select precisely your values.
    • Use your mouse wheel to scrool or extend/reduce the range (depends on an option).

    Create an Upload Form using jQuery, CSS3, HTML5 and PHP

    Create an Upload Form using jQuery, CSS3, HTML5 and PHP

    In this tutorial we will code an Upload Form from Impressionist UI. We will code it using the Plupload API. Plupload allows you to upload files using HTML5 Gears, Silverlight, Flash, BrowserPlus or normal forms, providing some unique features such as upload progress, image resizing and chunked uploads. This way we are able to create a very powerful upload form compatible with all browsers. So let’s get started

    elFinder : jQuery File manager for web

    elFinder : jQuery File manager for web

    elFinder is an open-source file manager for web, written in JavaScript using jQuery UI. Creation is inspired by simplicity and convenience of Finder program used in Mac OS X operating system.

    Features:

    • All operations with files and folders on a remote server (copy, move, upload, create folder/file, rename, etc.)
    • High performance server beckend and light client UI
    • Local file system, MySQL, FTP volume storage drivers
    • Background file upload with Drag & Drop HTML5 support
    • Standard methods of file/group selection using mouse or keyboard
    • Move/Copy files with Drag & Drop
    • Archives create/extract (zip, rar, 7z, tar, gzip, bzip2)
    • Quicklook, preview for common file types
    • “Places” for your favorites
    • Calculate directory sizes
    • Thumbnails for image files
    • Easy to integrate with web editors (elRTE, CKEditor, TinyMCE)
    • Flexible configuration of access rights, upload file types, user interface and other
    • Simple client-server API based on JSON

    jQuery UI Touch Punch : Touch events for jQuery UI with Demo

    jQuery UI Touch Punch

    A duck punch for adding touch events to jQuery UI.This little library was written to punch in touch events to jQuery UI by providing touch proxies that simulate mouse events.

    noUiSlider : jQuery Range Slider with Demo

    noUiSlider : jQuery Range Slider with Demo

    noUiSlider is a little jQuery plugin that turns a html object into a nice (range) slider. It can have two handles to select a range, a fixed minimum or maximum to select a limit, or just two handles to pick some points.

    Every event in the noUiSlider has an optional callback, so you can completely control any slider interaction. There is also some cool math in the read-out functions, so you can dynamically calculate any selected value. noUiSlider is developed to provide some basic slider functionality, without having to include the complete jQuery UI library.

    rcarousel : A continuous jQuery UI carousel with Demo

    rcarousel : A continuous jQuery UI carousel with Demo

    rcarousel is a jQuery UI continuous carousel with many cool features. It is highly customizable and supports even older browsers (No IE6, please). rcarousel is very simple to use. Just add some elements into a container and run the widget on it!