Fade in page
with CSS


RapidWeave Stacks Blog:
Fade in page< with CSS
Add these lines to Custom CSS in your RapidWeaver file:
Page Inspector > Header > CSS (Custom CSS)

Insted of targeting the html you could target body instead - and probably any other div id/class on your page. What works best depends on the theme and the content on your site and the theme you use. Or you could use to just target the header.

Note: The CSS fade-in will not work in ancient browsers and Windows 9… they will ignore the css.



html {
animation: fadein 5s;
-moz-animation: fadein 5s;
-webkit-animation: fadein 5s;
-o-animation: fadein 5s;
}

@keyframes fadein {
from {
opacity:0;
}
to {
opacity:1;
}
}
@-moz-keyframes fadein {
from {
opacity:0;
}
to {
opacity:1;
}
}
@-webkit-keyframes fadein {
from {
opacity:0;
}
to {
opacity:1;
}
}


DeFliGra · Stack’oholic | Mac’oholic | Web’oholic
https://defligra.weavers.space | Stacks for RapidWeaver