Best jQuery Animation Plugins & Tutorials with Demo

Slider Revolution jQuery Visual Editor Addon

Slider Revolution jQuery Visual Editor Addon

If you don’t have the option to use WordPress on your server or just don’t want to, the Slider Revolution jQuery Visual Editor Addon which (only) works in conjunction with our Slider Revolution Responsive jQuery Plugin is the best choice.

  • Complete Graphical User Interface
  • Full Control over Styles, Animations, Transitions
  • Works on Desktops, Notebooks, Tablets & Smartphones
  • HTML5, YouTube & Vimeo Video Support
  • Fallback Options for Mobile Devices

Proton : HTML5 Particle Engine

Proton : HTML5 Particle Engine

Proton is an easily customizable html5 particle engine including five different types of renderers.

  • Five kinds of renderers
    • canvas
    • dom
    • webgl
    • easeljs
    • pixel
  • Integratable into any game engine
  • Veriety of behaviors
  • Three kinds of emitters which can simulate many different physical effects

Material Design Hierarchical Display

Material Design Hierarchical Display

The jQuery plugin for Material Design hierarchical display animation effect.

Dual Sliding Panels with CSS3 & JavaScript

Dual Sliding Panels with CSS3 & JavaScript

Dual sliding panels for presenting content in a fun way. Built with Stylus and vanilla JavaScript.

Shazam-Like Morphing Button Effect

Shazam-Like Morphing Button Effect

A tutorial on how to create a Shazam-like button that morphs into a music player using Snap.svg. We’ll animate some musical notes that fly from outside of the viewport to the listening button to indicate listening activity. Finally, the listening button will transform into a music player with album info of the “identified” song.

jQuery Audio Equalizer Animation

jQuery Audio Equalizer Animation

jQuery Audio Equalizer Animation is simple jQuery based equalizer for <audio></audio> tags.

Pt : Experimental Library on Point, form and Space

Pt : Experimental Library on Point, form and Space

Pt is an experimental library on point, form, and space. It is experimental and fun, and I hope you will use it to make crazy, strange, awesome things.

Roll.js : JavaScript Roll & Scroll Tracking

Roll.js : JavaScript Roll & Scroll Tracking

A little js library (~8kb min, 3kb gzip, no dependencies) to help you keep track of position, scrolling, and pagination.

Animating an SVG Menu Icon with Segment

Animating an SVG Menu Icon with Segment

A tutorial on how to implement an animated menu icon based on the Dribbble shot by Tamas Kojo using SVG and Segment, a JavaScript library for drawing and animating SVG paths.

Animated Arrow Navigations With FlexSlider And CSS3

Animated Arrow Navigations With FlexSlider And CSS3

All of you should be quite familiar with Codrop’s  “Arrow Navigation Styles” tutorials. They are really inspiring and creative. I played with the Arrow Navigation styles demo, I’m impressed. And I wondered how hard would it be to really implement it on Slider without actually create a slider that does that. First slider that immediately came into my mind is FlexSlider.