Father of CSS Animation
tada
Main CSS Code
@charset "UTF-8";
/*!
* animate.css
-http://daneden.me/animate
* Version - 3.5.2
* Licensed under the MIT license -
http://opensource.org/licenses/MIT
*
* Copyright (c) 2017 Daniel Eden
*/
.animated {
animation-duration:
1s;
animation-fill-mode:
both;
}
.animated.infinite {
animation-iteration-count:
infinite;
}
.animated.hinge {
animation-duration:
2s;
}
.animated.flipOutX,
.animated.flipOutY,
.animated.bounceIn,
.animated.bounceOut {
animation-duration:
.75s;
}
wobble
@keyframes wobble {
from {
transform: none;
}
15% {
transform: translate3d(-25%, 0, 0) rotate3d(0,
0, 1, -5deg);
}
30% {
transform: translate3d(20%, 0, 0) rotate3d(0,
0, 1, 3deg);
}
45% {
transform: translate3d(-15%, 0, 0) rotate3d(0,
0, 1, -3deg);
}
60% {
transform: translate3d(10%, 0, 0) rotate3d(0,
0, 1, 2deg);
}
75% {
transform: translate3d(-5%, 0, 0) rotate3d(0,
0, 1, -1deg);
}
to {
transform: none;
}
}
.wobble {
animation-name:
wobble;
}
jello
bounce
bounceOut
bounce
Down
Down
bounce
InUp
InUp
fade
InDown
InDown
fadeIn
Left
Left
fadeIn
LeftBig
LeftBig
zoom
InDown
InDown
zoomIn
Left
Left
Heya i am for the first time here. I came across this board and I to find It truly useful & it helped me out much. I am hoping to offer something again and help others such as you aided me.
ReplyDelete