Du får göra det med custom-annimation och keyframes. T.ex. såhär:
Kod:
.delayed-fading-text {
opacity: 0;
animation: fadeIn 3s linear 5s;
-webkit-animation: fadeIn 3s linear 5s;
}
@keyframes fadeIn
{
0% {opacity: 0;}
100% {opacity: 1;}
}
@-webkit-keyframes fadeIn
{
0% {opacity: 0;}
100% {opacity: 1;}
}
Med den här koden är animationens längd 10 sekunder vilket gör att texten börjar fadea in efter 5 sekunder och har når 100% opacitet på 3 sekunder, vilket innebär att texten får 100% opacitet 8 sekunder efter att sidan laddades.
Notera att koden är otestad skriven ur minnet, men den bör fungera.