ict-site/css/animations/entry_animations.css

148 lines
2.2 KiB
CSS
Raw Normal View History

2016-10-27 20:33:41 +00:00
.entry {
animation: entry 2s ease 1 normal;
}
.entry-left {
animation: entry-left 4s ease 1 normal;
}
.entry-right {
animation: entry-right 4s ease 1 normal;
}
.entry-bottom {
animation: entry-bottom 4s ease 1 normal;
}
.typingAnimation {
overflow: hidden;
white-space: nowrap;
width: 8em;
animation:
typing 5s;
}
/* this is entering transition from left*/
@-webkit-keyframes entry-left {
from {
opacity: 0;
left: -800px;
}
}
@-moz-keyframes entry-left {
from {
opacity: 0;
left: -800px;
}
}
@-o-keyframes entry-left {
from {
opacity: 0;
left: -800px;
}
}
@keyframes entry-left {
from {
opacity: 0;
left: -800px;
}
}
/* this is entering transition from bottom */
@-webkit-keyframes entry-bottom {
from {
opacity: 0;
bottom: -600px;
}
}
@-moz-keyframes entry-bottom {
from {
opacity: 0;
bottom: -600px;
}
}
@-o-keyframes entry-bottom {
from {
opacity: 0;
bottom: -600px;
}
}
@keyframes entry-bottom {
from {
opacity: 0;
bottom: -600px;
}
}
/* this is entering transition from right*/
@-webkit-keyframes entry-right {
from {
opacity: 0;
right: -800px;
}
}
@-moz-keyframes entry-right {
from {
opacity: 0;
right: -800px;
}
}
@-o-keyframes entry-right {
from {
opacity: 0;
right: -800px;
}
}
@keyframes entry-right {
from {
opacity: 0;
right: -800px;
}
}
/* this is entering transition*/
@-webkit-keyframes entry {
from {
opacity: 0;
}
}
@-moz-keyframes entry {
from {
opacity: 0;
}
}
@-o-keyframes entry {
from {
opacity: 0;
}
}
@keyframes entry {
from {
opacity: 0;
}
}
/*Typing*/
@-webkit-keyframes typing {
from {
width: 0px;
}
}
@-moz-keyframes typing {
from {
width: 0px;
}
}
@-o-keyframes typing {
from {
width: 0px;
}
}
@keyframes typing {
from {
width: 0px;
}
}