css fade in andf fade out code example
Example 1: css fade out
/* Just add .fade-out class to element */
.fade-out {
animation: fadeOut 2s;
opacity: 0;
}
@keyframes fadeOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
Example 2: css fade in and stay
.fadePopInAndStay {
display: block;
opacity: 0;
visibility: visible;
animation-name: doAnimStay;
animation-duration: 2s;
animation-fill-mode: forwards;/* Makes it stay after animation */
}
@-webkit-keyframes doAnimStay{
0% {opacity:0;}
100% {opacity:1;}
}