Merge pull request #398 from procodeing/master

"jello animation"
This commit is contained in:
Daniel Eden 2015-05-11 20:48:58 -07:00
commit 9d4c59e5e5
5 changed files with 134 additions and 9 deletions

View File

@ -24,6 +24,7 @@
* `swing`
* `tada`
* `wobble`
* `jello`
* `bounceIn`
* `bounceInDown`
* `bounceInLeft`
@ -156,7 +157,8 @@ Next, run `grunt watch` to watch for changes and compile your custom builds. For
"shake": true,
"swing": true,
"tada": true,
"wobble": true
"wobble": true,
"jello":true
}
```

View File

@ -8,7 +8,8 @@
"shake": true,
"swing": true,
"tada": true,
"wobble": true
"wobble": true,
"jello": true
},
"bouncing_entrances": {

93
animate.css vendored
View File

@ -484,6 +484,97 @@ Copyright (c) 2015 Daniel Eden
animation-name: wobble;
}
@-webkit-keyframes jello {
11.1% {
-webkit-transform: none;
transform: none
}
22.2% {
-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
transform: skewX(-12.5deg) skewY(-12.5deg)
}
33.3% {
-webkit-transform: skewX(6.25deg) skewY(6.25deg);
transform: skewX(6.25deg) skewY(6.25deg)
}
44.4% {
-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
transform: skewX(-3.125deg) skewY(-3.125deg)
}
55.5% {
-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
transform: skewX(1.5625deg) skewY(1.5625deg)
}
66.6% {
-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
transform: skewX(-0.78125deg) skewY(-0.78125deg)
}
77.7% {
-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
transform: skewX(0.390625deg) skewY(0.390625deg)
}
88.8% {
-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
transform: skewX(-0.1953125deg) skewY(-0.1953125deg)
}
100% {
-webkit-transform: none;
transform: none
}
}
@keyframes jello {
11.1% {
-webkit-transform: none;
transform: none
}
22.2% {
-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
transform: skewX(-12.5deg) skewY(-12.5deg)
}
33.3% {
-webkit-transform: skewX(6.25deg) skewY(6.25deg);
transform: skewX(6.25deg) skewY(6.25deg)
}
44.4% {
-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
transform: skewX(-3.125deg) skewY(-3.125deg)
}
55.5% {
-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
transform: skewX(1.5625deg) skewY(1.5625deg)
}
66.6% {
-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
transform: skewX(-0.78125deg) skewY(-0.78125deg)
}
77.7% {
-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
transform: skewX(0.390625deg) skewY(0.390625deg)
}
88.8% {
-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
transform: skewX(-0.1953125deg) skewY(-0.1953125deg)
}
100% {
-webkit-transform: none;
transform: none
}
}
.jello{
-webkit-animation-name:jello;
animation-name:jello;
-webkit-transform-origin: center;
transform-origin: center
}
@-webkit-keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
@ -3178,4 +3269,4 @@ Copyright (c) 2015 Daniel Eden
.slideOutUp {
-webkit-animation-name: slideOutUp;
animation-name: slideOutUp;
}
}

7
animate.min.css vendored

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,36 @@
@keyframes jello {
11.1% {
transform: none
}
22.2% {
transform: skewX(-12.5deg) skewY(-12.5deg)
}
33.3% {
transform: skewX(6.25deg) skewY(6.25deg)
}
44.4% {
transform: skewX(-3.125deg) skewY(-3.125deg)
}
55.5% {
transform: skewX(1.5625deg) skewY(1.5625deg)
}
66.6% {
transform: skewX(-0.78125deg) skewY(-0.78125deg)
}
77.7% {
transform: skewX(0.390625deg) skewY(0.390625deg)
}
88.8% {
transform: skewX(-0.1953125deg) skewY(-0.1953125deg)
}
100% {
transform: none
}
}
.jello{
animation-name:jello;
transform-origin: center
}