Best jQuery Plugins Plugins & Tutorials with Demo

    bootstrap-wysiwyg : jQuery Bootstrap WYSIWYG rich-content editor

    April 9, 2013 | Bootstrap, Plugins, Web
    bootstrap-wysiwyg : jQuery Bootstrap WYSIWYG rich-content editor

    Tiny bootstrap-compatible WISWYG rich text editor, based on browser execCommand, built originally for MindMup. Here are the key features:

    • Automatically binds standard hotkeys for common operations on Mac and Windows
    • Drag and drop files to insert images, support image upload (also taking photos on mobile devices)
    • Allows a custom built toolbar, no magic markup generators, enabling the web site to use all the goodness of Bootstrap, Font Awesome and so on…
    • Does not force any styling – it’s all up to you
    • Uses standard browser features, no magic non-standard code, toolbar and keyboard configurable to execute any supported browser command
    • Does not create a separate frame, backup text areas etc – instead keeps it simple and runs everything inline in a DIV
    • (Optionally) cleans up trailing whitespace and empty divs and spans
    • Requires a modern browser (tested in Chrome 26, Firefox 19, Safari 6)
    • Supports mobile devices (tested on IOS 6 Ipad/Iphone and Android 4.1.1 Chrome)
    Read More Demo

    canvasResize : jQuery Client side Image resizing plugin

    April 9, 2013 | Image Effects, Plugins
    canvasResize : jQuery Client side Image resizing plugin

    canvasResize is a plugin for client side image resizing.It’s compatible with iOS6 and Android 2.3+ It can work both with jQuery and Zepto.

    I fixed iOS6 Safari’s image file rendering issue for large size image (over mega-pixel) using few functions from ios-imagefile-megapixel and fixed orientation issue by using exif-js.You can change image size and quality with plugin options easily.

    Read More Demo

    validator : jQuery cross-browser validation plugin

    April 8, 2013 | Forms, Plugins
    validator : jQuery cross-browser validation plugin

    The javascript validation code is based on jQuery. The Validator is cross-browser and will give you the power to use future-proof input types such as ‘tel’, ‘email’, ‘number’, ‘date’, and ‘url’. I can sum this as a ‘template’ for creating web forms.

    In the semantic point-of-view, I believe that this method is very clean and…appropriate. This is how forms should be, IMHO.

    Features:

    • Cross browser validation
    • Deals with all sorts of edge cases
    • Utilize new HTML5 types for unsupported browsers
    • Flexible error messaging system
    Read More Demo

    Metro Style Side Menu with jQuery

    April 8, 2013 | HTML5, Menus, Plugins, Premium, SVG Tutorial
    Metro Style Side Menu with jQuery

    Metro Style Side Menu with jQuery.

    Features:

    • Crossbrowser
    • Simple/Clean
    • Metro Style
    • 900+ SVG Icons
    • Hight Resolution (100% vector)
    • Valid HTML5
    Read More Demo

    SliderJS : A simple jQuery full-screen Slider

    April 8, 2013 | Plugins, Slider
    SliderJS : A simple jQuery full-screen Slider

    A simple jQuery plugin for full screen image slideshows.Options you can pass into the config JSON that the slider consumes.

    Features Options:

    • Integer : The index of the first element to start with.
    • draggable : Will allow images to be dragged via touch events if supported, otherwise mouse events.
    • sizeConstraint : which fills the image to the browser, cropping what exceeds.
    • manualShift :  if you want to shiftLeft and shiftRight manually, rather than on click.
    • enableKeys :  if you want to disable keyboard navigation
    Read More Demo

    fancyInput : Typing in Input fields with CSS3 effects & jQuery

    April 8, 2013 | CSS2 / CSS3.0, Forms, Plugins, Text Effect
    fancyInput : Typing in Input fields with CSS3 effects & jQuery

    Makes typing & deleting in input / textarea fields exciting with CSS3 effects and jQuery

    Read More Demo

    windows : jQuery plugin for full-screen scrolling

    April 7, 2013 | Plugins
    windows : jQuery plugin for full-screen scrolling

    A handy, loosely-coupled jQuery plugin for full-screen scrolling windows.The plugin simply opens up a handy API for position management, provides callbacks, and will allow for window snapping. No CSS is applied to the callee.

    Read More Demo

    Mate Hover : jQuery Image hover animations Plugin

    April 7, 2013 | Animation, Image Effects, Plugins, Premium, Responsive
    Mate Hover : jQuery Image hover animations Plugin

    Mate Hover – is a jQuery plugin for image hover animations. You can change the appearance of pop-up elements. You can embed your icons, text etc.

    Features:

    • Ready to Responsive and Adaptive
    • Simple to use
    • Cross Browsers
    • Allow multiple connections
    • Auto Size(on/off)
    • Inhirit Padding(on/off)
    • Supports thirty animation effects from jQuery Easing
    • Overlay Style: classic,rolling(top,bottom,right,left),double(vertical,horizontal),four
    Read More Demo

    Slickhover.js : jQuery Slick and Smooth hover effect plugin

    April 6, 2013 | Image Effects, Plugins
    Slickhover.js : jQuery Slick and Smooth hover effect plugin

    Slickhover.js is a lightweight useful jQuery plugin that produces a slick and smooth hover effect that fades out images and shows a custom icon when a user hovers over an image. All you have to do is call it on an image selector.

    Read More Demo

    Flexisel : jQuery Responsive Carousel Plugin

    April 6, 2013 | Carousel, Plugins, Responsive
    Flexisel : jQuery Responsive Carousel Plugin

    As long as there has been jQuery there have been image carousels created with jQuery. The famous jCarousel has been out since 2006, the same year the first version of jQuery was released. However, with the explosion of users now using their mobile devices for their internet browsing — on iPhones, iPads, and the like — it becomes necessary for jQuery plugins to support a good user experience on these devices. Enter Flexisel, the responsive image carousel with options specifically available for adapting the carousel for mobile and tablet devices.

    Check out the demo here. Resize your browser window to see how you the plugin can adjust to the window width.

    Read More Demo