Best jQuery Animation Plugins & Tutorials with Demo

    Product Comparison Layout & Effect with CSS3

    Product Comparison Layout & Effect with CSS3

    A basic responsive product grid layout with comparison functionality and a slide-in effect.This Blueprint is a responsive product grid layout with comparison functionality. A maximum of three items can be selected for the product comparison. The comparison view shows flexbox-powered columns or rows (depending on the viewport size) that appear with a slide-in effect. There are a couple of example media queries for smaller viewports.

    Sprite control plugin for jQuery

    Sprite control plugin for jQuery

    Sprite control plugin for jQuery & GSAP.

    Iconate.js : Animated Icons with JavaScript CSS3

    Iconate.js : Animated Icons with JavaScript CSS3

    Iconate.js is a tiny performant library for cross-browser icon transformation with trendy animations in your projects.

    Motion Slider jQuery Plugin

    Motion Slider jQuery Plugin

    Motion Slider is a responsive jQuery slider plugin for mobile and desktop that enables multi-transition and browser prefix free CSS animation to your HTML DOM elements.

    • Easy CSS Animation with Multiple Transitions
    • Create Cool 2D and 3D Transforms
    • Works with CSS3 Animation
    • No Browser Prefix Needed
    • Use Text, ScrambleText, Bezier and Physics2D Plugins
    • Break Apart an Image into Tiles or Text into Lines, Words or Characters
    • Fully responsive
    • Cross-browser, IOS and Android Compatible
    • Multiple Sliders in One Page
    • Smart Loading Using Adaptive Images

    Boomer : jQuery Animated Cursors

    Boomer : jQuery Animated Cursors

    Boomer finally adds cross-browser support for animated GIF cursors. Just copy and paste the cursor element inside any HTML element and choose the GIF preset you want. Use any animated GIF on any HTML element!

    PixelFlow.js : jQuery Image Pixelating Plugin

    PixelFlow.js : jQuery Image Pixelating Plugin

    PixelFlow.js is an image pixelating filter jquery plugin using canvas.

    jQuery Animate Particles Burst Plugin

    jQuery Animate Particles Burst Plugin

    This plugin generates particules from an element.Images are appended to the DOM then fade in, animate randomly, fade out.Multiple calls generate the particule effect.

    Pixi.js : A 2D JavaScript Renderer

    Pixi.js : A 2D JavaScript Renderer

    Super fast HTML 5 2D rendering engine that uses webGL with canvas fallback.The aim of this project is to provide a fast lightweight 2D library that works across all devices. The Pixi renderer allows everyone to enjoy the power of hardware acceleration without prior knowledge of WebGL.

    Features:

    • WebGL renderer (with automatic smart batching allowing for REALLY fast performance)
    • Canvas renderer (Fastest in town!)
    • Full scene graph
    • Super easy to use API (similar to the flash display list API)
    • Support for texture atlases
    • Asset loader / sprite sheet loader
    • Auto-detect which renderer should be used
    • Full Mouse and Multi-touch Interaction
    • Text
    • BitmapFont text
    • Multiline Text
    • Render Texture
    • Spine support
    • Primitive Drawing
    • Masking
    • Filters

    Animated Page Transition with CSS3 & jQuery

    Animated Page Transition with CSS3 & jQuery

    A CSS powered animation, that replaces the refresh of the page while the content is updated using Ajax.We used the pushState method to manipulate the browser history.

    jQuery Layered Navigation with CSS3

    jQuery Layered Navigation with CSS3

    Layered navigation allows you to easily implement a new navigation system using the jQuery JavaScript library. It combines the presentation into two sections, you won’t need cutting the images into two, an entire section, and through slides at once. It includes CSS3 animations to show the elements, a side menu to show sections and a progress bar indicates the progress along web site. It allows you to include maps and videos in a fast and easy way.