Created
January 6, 2014 10:50
-
-
Save lukehedger/8281085 to your computer and use it in GitHub Desktop.
Bouncing text - with webkit prefixes, add others as required.
This file contains hidden or 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
| .bouncer { | |
| display: inline-block; | |
| -webkit-animation: bouncing 1s ease-in-out infinite; | |
| -webkit-transform-origin: 50% 50%; | |
| } | |
| @-webkit-keyframes bouncing { | |
| 0% { | |
| -webkit-transform: translateY(-3px); | |
| } | |
| 25% { | |
| -webkit-transform: translateY(0px); | |
| } | |
| 35% { | |
| -webkit-transform: translateY(-2px); | |
| } | |
| 45% { | |
| -webkit-transform: translateY(0px); | |
| } | |
| 50% { | |
| -webkit-transform: translateY(-1px); | |
| } | |
| 100% { | |
| -webkit-transform: translateY(0px); | |
| } | |
| } | |
| /* Example HTML - <span class="bouncer">￪</span> */ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment