jquery-css-transitions
A jQuery plugin for using CSS transitions when available instead of the animate() from jQuery. Everything is handled by the browser.
This plugin is meant to be used in replacement of the default animate() function from jQuery.
Usage
The plugin works in the same fashion as the css() and animate() functions combined. Ex.:
Ordinary jQuery Animation
$('selector').animate({opacity: 1}, 1200, function(){ console.log('Animation ended');});
Normal with CSS transitions
$('selector').cssTransitions({opacity: 1}, 1200, function(){ console.log('Animation with css-transitions ended');});
Why use this?
The idea is simple: the browser handles it all. When using animate(), jQuery changes the property value every loop by incrementing/decrementing according to the duration.†.
† You can see this behaviour with the console on. Fade in a element and you will see the inline style for opacity gradually changing e.g.: 0.0123 … 0.0345 … 0.1234…