JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://meodai.ch/alainbenoit/js/libs/modernizr-1.6.min.js"></script>
<div>
</div>
CSS
div {
width: 300px;
height: 300px;
background: green;
}
JavaScript
/*
* jQuery.css3animate.js v.0.21 by David Aerne ( meodai.ch )
* free to use and/or modify not protected by any kind of lisence.
* Last modification: 2011-3-13
*
* Animates with CSS3 Transition if possible
* usage: .css3animate([ css object ], speed, callback);
*
* Depends on: modernizer.js && jQuery
*
* Special thanks to Stackoverflow.
*/
(function( $,undefined ){
//global plugin variables
var settings, browserPrefix, animation, transitionEndEvent, $fnStop;
//default settings
settings = {
"speed" : 500,
"browsers" : {
"webkit" : { "prefix" : "-webkit-",
"endEvent" : "webkitTransitionEnd"
},
"mozilla" : { "prefix" : "-moz-",
"endEvent" : "transitionend"
},
"opera" : { "prefix" : "-o-",
"endEvent" : "oTransitionEnd"
},
"msie" : { "prefix" : "-ms-",
"endEvent" : "TransitionEnd"
},
"fallback": { "prefix" : "",
"endEvent" : "transitionend"
}
}
};
//deterime browser prefix and transitionEndEvent
if ($.browser.webkit) {
browserPrefix = settings.browsers.webkit.prefix;
transitionEndEvent = settings.browsers.webkit.endEvent;
} else if ($.browser.msie) {
browserPrefix = settings.browsers.msie.prefix;
transitionEndEvent = settings.browsers.msie.endEvent;
} else if ($.browser.mozilla) {
browserPrefix = settings.browsers.mozilla.prefix;
transitionEndEvent = settings.browsers.mozilla.endEvent;
} else if ($.browser.opera) {
browserPrefix = settings.browsers.opera.prefix;
transitionEndEvent = settings.browsers.opera.endEvent;
} else {
browserPrefix = settings.browsers.fallback.prefix;
transitionEndEvent = settings.browsers.fallback.endEvent;
}
animation = function($obj, cssObject, speed, callback) {
if (!speed) {
var speed =...