Best jQuery Animation Plugins & Tutorials with Demo

    jQuery FadeThis : Plugin for fade-as-you-scroll Features

    jQuery FadeThis : Plugin for fade-as-you-scroll Features

    A lightweight jQuery plugin for fade-as-you-scroll features.

    Easy Animated Backgrounds jQuery Plugin

    Easy Animated Backgrounds jQuery Plugin

    With easy backgrounds you can add animated and non animated backgrounds to your webpage and HTML elements using just a few lines of code.

    The plugin is just 14kb and supports particles, slideshows, videos, gradients and animated patterns.You can customize your background using 36+ options and some preset overlays or you can use a image as overlay!

    Background Type:

    • Particles
    • Patterns (animated and non animated)
    • Gradients (animated and non animated)
    • Full screen youtube video´s
    • Images
    • Slideshows

    LetterFx jQuery Plugin

    LetterFx jQuery Plugin

    A jQuery plugin to apply animated, visual effects to letters, words or other text patterns.

    Multi-Screen.js : jQuery plugin Turns a Single page into Collection of Screens

    Multi-Screen.js : jQuery plugin Turns a Single page into Collection of Screens

    A simple, lightweight, and easy to use jQuery plugin which turns a single page into a collection of screens with animated navigation.

    Multi-Screen.js makes it easy to change the defaults for the animations, their times, the starting distance between the entering and exiting screens, and whether the animations should occur synchronously or asynchronously.

    ScrollReveal.js : Declarative on-scroll Reveal Animations

    ScrollReveal.js : Declarative on-scroll Reveal Animations

    A simple way to create and maintain how elements fade in, triggered when they enter the viewport.

    Clickstream.js : jQuery plugin for Effects to a Page Transition

    Clickstream.js : jQuery plugin for Effects to a Page Transition

    Clickstream is a jquery plugin for Effects to a page transition.By using this plugin you can add fade transition or positioning transition to your web page.

    Planetarium : jQuery Plugin to Construct Interactive Planet

    Planetarium : jQuery Plugin to Construct Interactive Planet

    A jQuery plugin that will let you construct an interactive planet and build the Universe on your website.

    Theme Slider : jQuery FullScreen Touch Slider Plugin

    Theme Slider : jQuery FullScreen Touch Slider Plugin

    Modern Touch-Enabled FullScreen Slider with Unlimited Layers and Animations.

    Features:

    • Responsive, Mobile-Friendly with Touch/Swipe Support
    • 91 Predefined Layer Positions, 650+ Font Styles (Google Fonts), 360+ Icons (Font Awesome Icons)
    • Unlimited Layers, Sublayers, Text Layers, Transitions, All of Them should be Animated
    • Compatible with All Major Browsers
    • Custom YouTube Player with Additional Options (Autoplay, Resize to Fit to the Screen, Loop, Hide Control Bar)
    • Customizable Animation Time, Delay for Each Main Slide, Sublayer, Text Layer, Custom Options for Text Animations
    • 80+ Animation Types, combined with Easing Effects you can create more than 300 Unique Animations
    • 10+ Main Slider Animations with Hardware Accelerated CSS3 Technology
    • 30+ Text Animations
    • 10+ Sublayer Animations with in and out animations including random type
    • 30+ Easing Effects
    • AutoPlay, Control Options (color, position for global or each slides)
    • Integrated Preloader with 5 custom animations

    Circular Progress Button with SVG Animation

    Circular Progress Button with SVG Animation

    A tutorial on how to implement the circular progress button concept by Colin Garven. We are using the SVG line drawing animation technique as described by Jake Archibald to animate the circular progress and provide a success and error state to indicate the final status.

    MagicWall : jQuery Responsive Image Grid Plugin

    MagicWall : jQuery Responsive Image Grid Plugin

    MagicWall is a jQuery plugin for creating an image grid that cycles through a set of images using attractive animations at a specific time interval. You can use this plugin to create a decorative element of your website, display your work or simply use it as a nice animated background. MagicWall plugin converts a list of images into a grid with defined number of rows and columns. The remaining images will appear with different animations and delays.

    Features:

    • Responsive grid
    • Hardware Accelerated
    • Fullwidth layout
    • Fullscreen layout
    • Highly customizable
    • 22 Animations
    • Sass files included
    • Small file size