Created
July 23, 2012 20:41
-
-
Save flimshaw/3166097 to your computer and use it in GitHub Desktop.
Little jQuery plugin for calling CSS3 animations and attaching callbacks to them
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Generated by CoffeeScript 1.3.3 | |
// | |
// animateCss jQuery Plugin by Charlie Hoey <charlie.hoey@gmail.com> | |
// | |
// DESCRIPTION: Apply a CSS3 animation class, and and a callback to fire | |
// when it's done. Works well with animate.css (http://daneden.me/animate/) | |
// but custom css styles work just fine too. | |
// | |
// USAGE: $("#divID").animateCss({ startAnimation: "bounceOutRight", callback: function() { console.log("Done!"); }); | |
// | |
// OPTIONS: | |
// callback: callback function | |
// startAnimation: name of class containing the desired CSS3 animation | |
(function() { | |
var $; | |
$ = jQuery; | |
$.fn.extend({ | |
animateCss: function(options) { | |
var log, settings; | |
settings = { | |
startAnimation: 'shake', | |
callback: false, | |
forceBlock: true | |
}; | |
settings = $.extend(settings, options); | |
return this.each(function() { | |
var obj; | |
obj = this; | |
obj.finished = false; | |
// add our animation class, which also incidentally starts the animation | |
$(obj).addClass("animated " + settings.startAnimation); | |
// make sure our object is display: block | |
if (!settings.forceBlock) { | |
$(obj).css({ | |
'display': 'block' | |
}); | |
} | |
// bind our callback function to the webkit event | |
return $(obj).bind("webkitAnimationEnd", function(event) { | |
// remove our first animation, preparing us for more animations later | |
$(obj).removeClass(settings.startAnimation); | |
// if we have defined a callback function, call it | |
if (settings.callback !== false) { | |
return settings.callback(); | |
} | |
}); | |
}); | |
} | |
}); | |
}).call(this); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment