Skip to content

Instantly share code, notes, and snippets.

@daneden
Created December 6, 2011 13:23
Show Gist options
  • Star 10 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save daneden/1438197 to your computer and use it in GitHub Desktop.
Save daneden/1438197 to your computer and use it in GitHub Desktop.
A function to apply animate.css classes dynamically
// Use the animate.css animations
function animate(element, effect, delay, callback) {
// Set a delay if needed
var animation = setTimeout(function () {
// Add the animation effect with classes
$(element).addClass('animate ' + effect);
// Check if the elemenr has been hidden to start with to prevent FOUC
if ($(element).css('visibility') == 'hidden') {
// If it has, show it (after the class has been added)
$(element).css({
'visibility': 'visible'
});
}
if ($(element).css('display') == 'none') {
$(element).css({
'display': 'inherit'
});
}
// Event triggered when the animation has finished
$(element).bind('animationend webkitAnimationEnd', function () {
// Remove the classes (so they can be triggered again if needed)
//$(element).removeClass('animate '+effect);
// Add a callback event
if (typeof callback == 'function') {
callback.call(this);
}
});
}, delay);
}
@aranw
Copy link

aranw commented Dec 6, 2011

Ha I saw this code on that site you tweeted... I just uploaded the Google Social Tracking code from that site...

@craigmdennis
Copy link

This is now a plugin: https://gist.github.com/1438179

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment