CSS: fade la încărcarea paginilor

Micunealta asta secretă adaugă fade pe body la încărcarea paginilor 😀

Adaugă module-animated module-fadein în body, după care aruncă CSS-ul de mai jos în CSS-ul website-ului tău.

.module-animated {
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
}
.module-fadein {
    -webkit-animation-name: module-fadein;
    -moz-animation-name: module-fadein;
    -o-animation-name: module-fadein;
    animation-name: module-fadein;
}
@-webkit-keyframes module-fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-moz-keyframes module-fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-o-keyframes module-fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes module-fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

Cu plăcere 🙂

Etichete: ,

Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate cu *