40 lines
695 B
CSS
40 lines
695 B
CSS
|
@keyframes jello {
|
||
|
|
0% {
|
||
|
|
transform: none
|
||
|
|
}
|
||
|
|
10% {
|
||
|
|
transform: skewX(-50deg) skewY(-50deg)
|
||
|
|
}
|
||
|
|
20% {
|
||
|
|
transform: skewX(25deg) skewY(25deg)
|
||
|
|
}
|
||
|
|
30% {
|
||
|
|
transform: skewX(-12.5deg) skewY(-12.5deg)
|
||
|
|
}
|
||
|
|
40% {
|
||
|
|
transform: skewX(6.25deg) skewY(6.25deg)
|
||
|
|
}
|
||
|
|
50% {
|
||
|
|
transform: skewX(-3.125deg) skewY(-3.125deg)
|
||
|
|
}
|
||
|
|
60% {
|
||
|
|
transform: skewX(1.5625deg) skewY(1.5625deg)
|
||
|
|
}
|
||
|
|
70% {
|
||
|
|
transform: skewX(-0.78125deg) skewY(-0.78125deg)
|
||
|
|
}
|
||
|
|
80% {
|
||
|
|
transform: skewX(0.390625deg) skewY(0.390625deg)
|
||
|
|
}
|
||
|
|
90% {
|
||
|
|
transform: skewX(-0.1953125deg) skewY(-0.1953125deg)
|
||
|
|
}
|
||
|
|
100% {
|
||
|
|
transform: none
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.jello{
|
||
|
|
animation-name:jello;
|
||
|
|
transform-origin: center
|
||
|
|
}
|