jQuery Animation Plugin & Tutorials with Example

Page Loading Effects Animation with SVG

Page Loading Effects Animation with SVG

A set of creative page loading effects that use SVG animations with Snap.svg. The idea is to show an overlay with a interesting shape animation while new content gets loaded.

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.



Best jQuery websites design awards