commit
9d4c59e5e5
|
@ -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
|
||||
}
|
||||
```
|
||||
|
||||
|
|
|
@ -8,7 +8,8 @@
|
|||
"shake": true,
|
||||
"swing": true,
|
||||
"tada": true,
|
||||
"wobble": true
|
||||
"wobble": true,
|
||||
"jello": true
|
||||
},
|
||||
|
||||
"bouncing_entrances": {
|
||||
|
|
|
@ -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);
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -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
|
||||
}
|
Loading…
Reference in New Issue