fakeLoader.js is a lightweight jQuery plugin that helps you create an animated spinner with a fullscreen loading mask to simulate the page preloading effect.
Best jQuery Animation Plugins & Tutorials with Demo
Elastic SVG Elements Animation
Today we’d like to share some inspiration for adding elasticity to elements. The idea is to integrate an SVG element into a component and then animate it from one path to another with an elastic animation. Using SVGs like this can make things like menus, buttons or other elements more interesting and make the interaction look more organic with a natural feel to it.
Traffico : jQuery Animated Cars & Trucks Plugin
Traffico is a jquery plugin that allow you to insert some funny vehicle running from a side to another side of your website.
- Cross browser support
- Easy to integrate
- Well documented and fully supported
- 64 images for 5 different vehicles in 5 different preset colors
- All the vehicles are avaiable in 2 different styles: detailed & flat
- Possibility to write on trucks
- You can create 200+ combinations to make your website become unique
- You can set up the speed of each vehicle
- You can set that vehicles appear only once or in an endless loop
- 40 preset functions
Shifty : A teeny tiny tweening engine in JavaScript
Shifty is a tweening engine for JavaScript. It is a lightweight library meant to be encapsulated by higher level tools. At its core, Shifty provides:
- Interpolation of
Numbers over time (tweening) - Playback control of an individual tween
- Extensibility hooks for key points in the tweening process
This is useful because it is the least amount of functionality needed to build customizable animations. Shifty is optimized to run many times a second with minimal processing and memory overhead, which is necessary to achieve smooth animations.
Walkway.js : Animate SVG elements
Walkway is an easy way to animate SVG elements.
Options:
- selector (mandatory) – The selector of the parent element (usually will be a specific svg element)
- duration – Time the animation should run for, in ms. Default is 400.
- easing – Name of the easing function used for drawing. Default is ‘easeInOutCubic’. You can also supply your own function that will be passed the progress and should return a value in the range of [0, 1];
