Best jQuery Animation Plugins & Tutorials with Demo

    jQuery Water Ripples Plugin

    jQuery Water Ripples Plugin

    Add water ripples to your background using WebGL.Add a layer of water to your HTML elements which will ripple by cursor interaction!

    Awesome Shop : Premium WordPress Catalog Grid

    Awesome Shop : Premium Wordpress Catalog Grid

    Awesome Shop is a premium multi-purpose slider for creating content sliders with must-see effects. It has a beautiful and easy-to-use admin interface with supporting modern features like drag n’drop WYSIWYG slider builder, real-time previews and Google Fonts. It’s device friendly by supporting responsive mode, multiple layouts.

    Features:

    • Responsive Layout
    • Parallax Effect
    • Animated Layers
    • Google Fonts – over +600 fonts
    • Easy setup – Drag&Drop
    • No extra coding
    • Best for eCommerce

    Animated SVG Icon with CSS & SVG

    Animated SVG Icon with CSS & SVG

    How to optimize SVG code and animate an SVG icon using CSS and Snap.svg library.

    Mobile App Introduction Template with CSS3 & jQuery

    Mobile App Introduction Template with CSS3 & jQuery

    A basic template to showcase the best features of your app, enriched with a video slider for a better user understanding. In this tutorial we can learn how to make this video slider effect to make mobile app introduction template with CSS3 and jQuery.

    Wobbly Slideshow Effect with SVG & JavaScript

    Wobbly Slideshow Effect with SVG & JavaScript

    The slides in this slideshow wobble as they move. The effect is based on Sergey Valiukh’s Dribbble shot and was made using Snap.svg and morphing SVG paths to animated the slide background SVGs in order to simulate the elastic effect. What happens is that we basically morph an SVG path from a rectangle to a curved shaped; either a right curve or a left curve, depending on where we are navigating to.

    Parallaxer : jQuery Parallax Effects on Content

    Parallaxer : jQuery Parallax Effects on Content

    Parallaxer is a script that turns any content into a cool parallax effect. It works smooth with any content you throw at it, images and even sliders, video players, basically any html content.

    Features:

    • fully responsive
    • touch optimized
    • CSS3 technology
    • iPhone / iPad optimized
    • Android optimized
    • SEO friendly
    • compatible with all major browsers, including IE
    • retina ready
    • embed ready
    • developer / SASS powered

    CSS3 Loader and Preloader with jQuery

    CSS3 Loader and Preloader with jQuery

    Css Loader is developed to load on screen a waiting spinner plugin for your customers.

    In just 2 minutes you can configure this plugin, with a few steps you will have transitions from page to page on your website.
    You also have the option of launching the loader if you are performing an action, to send data by Ajax, wait while a process is running, etc.

    Features:

    • 17 differenf spinners where you can set color
    • Ready to mobile
    • Css3 hardware accelerated
    • Ready for use between processis
    • Create your own theme
    • Set your custom callback to each element

    Ultimate jQuery Sliders Bundle – Layers, Parallax, Zoom

    Ultimate jQuery Sliders Bundle - Layers, Parallax, Zoom

    It contains all types of sliders/banners, from banner rotator, zoom in/out effect slider, parallax slider, carousel, sidebar banners and full screen background.

    Bundle Includes:

    • jQuery Banner Rotator / Content Slider / Carousel
    • jQuery Slider Zoom In/Out Effect Fully Responsive
    • Parallax Slider – Responsive jQuery Plugin

    jQuery Circle Animated Progress Bars

    jQuery Circle Animated Progress Bars

    jQuery Plugin to draw animated circular progress bars.

    jQuery AnimateScroll Navigation Plugin

    jQuery AnimateScroll Navigation Plugin

    A Simple jQuery Plugin extending animateScroll plugin with Single Page Scroll Capabilities.

    Features:

    • Smooth, continous scroll across sections
    • Ability to navigate to each and every section, also programatically
    • Possible menu integration, but I didin’t want menu to be included as part of a package
    • Each section can have different height
    • If section height is less then screen height – it can be adjusted
    • If section is higher then screen – we’re cool
    • It would support History API