animate.css/README.md

#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:

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

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

```css
#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)*

*Note: Safari in Mountion Lion (OS 10.8) has a display glitch with the Flippers. They may not appear at all until the animation is completed, or the page may have other artifacting. One fix is to add overflow: hidden to the parent div.*

##License
Animate.css is licensed under the &#9786; 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, &amp; 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
New readme 2011-12-14 11:14:22 +01:00			`#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:`

changes syntax highlighting code to javascript jquery is not detected in syntax highlighting 2012-09-13 20:23:26 +02:00			```javascript
New readme 2011-12-14 11:14:22 +01:00			`$('#yourElement').addClass('animated bounceOutLeft');`
			```

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

Update syntax highlighting for Readme 2012-09-13 17:43:41 +02:00			```css
Fix the code block (I hope) 2011-12-21 09:41:10 +01:00			`#yourElement {`
New readme 2011-12-14 11:14:22 +01:00			`-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)`

Add note for Mountain Lion Safari bug fix in Readme 2012-09-14 20:18:10 +02:00			`Note: Safari in Mountion Lion (OS 10.8) has a display glitch with the Flippers. They may not appear at all until the animation is completed, or the page may have other artifacting. One fix is to add overflow: hidden to the parent div.`
New readme 2011-12-14 11:14:22 +01:00
Update license 2012-03-24 18:59:47 +01:00			`##License`
			`Animate.css is licensed under the ☺ license. (http://licence.visualidiot.com/)`

New readme 2011-12-14 11:14:22 +01:00			`##Learn more`
			`You can learn more about animate.css over at http://daneden.me/animate`
Added a cheat sheet to the readme. Kinda silly but I found it useful. At least it's easy to copy/paste this to wherever the user wants it. 2012-07-20 08:57:12 +02:00			`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`