Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

ryhan/animate.css

Open more actions menu
 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 

Repository files navigation

#Animate.css Just-add-water CSS animation

animate.css is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.

##Usage To use animate.css in your website, simply drop the stylesheet into your document's <head>, and add the class animated to an element, along with any of the animation names. That's it! You've got a CSS animated element. Super!

You can do a whole bunch of other stuff with animate.css when you combine it with jQuery or add your own CSS rules. Dynamically add animations using jQuery with ease:

$('#yourElement').addClass('animated bounceOutLeft');

You can change the duration of your animations, add a delay or change the number of times that it plays!

#yourElement {
	-vendor-animation-duration: 3s;
	-vendor-animation-delay: 2s;
	-vendor-animation-iteration-count: infinite;
}

Note: be sure to replace "vendor" in the CSS with the applicable vendor prefixes (webkit, moz, ms, o)

##License Animate.css is licensed under the ☺ license. (http://licence.visualidiot.com/)

##Learn more You can learn more about animate.css over at http://daneden.me/animate You can also get in touch via email (dan.eden@me.com) or twitter (@_dte) if you need any help or have any issues.

##Cheat Sheet

####Attention seekers: flash bounce shake tada swing wobble wiggle pulse

####Flippers (currently Webkit, Firefox, & IE10 only): flip flipInX flipOutX flipInY flipOutY

####Fading entrances: fadeIn fadeInUp fadeInDown fadeInLeft fadeInRight fadeInUpBig fadeInDownBig fadeInLeftBig fadeInRightBig

####Fading exits: fadeOut fadeOutUp fadeOutDown fadeOutLeft fadeOutRight fadeOutUpBig fadeOutDownBig fadeOutLeftBig fadeOutRightBig

####Bouncing entrances: bounceIn bounceInDown bounceInUp bounceInLeft bounceInRight

####Bouncing exits: bounceOut bounceOutDown bounceOutUp bounceOutLeft bounceOutRight

####Rotating entrances: rotateIn rotateInDownLeft rotateInDownRight rotateInUpLeft rotateInUpRight

####Rotating exits: rotateOut rotateOutDownLeft rotateOutDownRight rotateOutUpLeft rotateOutUpRight

####Lightspeed: lightSpeedIn lightSpeedOut

####Specials: hinge rollIn rollOut

About

A big ol' goody bag filled with CSS animations for WebKit, Firefox and beyond.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published
Morty Proxy This is a proxified and sanitized view of the page, visit original site.