Viewing Global Fade

  1. Portal Home
  2. Forum
  3. EverWeb
  4. How do I...?

Global Fade



User: Les C. 8 years ago
Is there a way to get everything on a page (text, images, menu, etc.) to fade in collectively without having to write code for each element?


LC
User: Roddy 8 years ago
Apply the animation to the body element like this...

<style type="text/css">
body {
animation: fadein 10s;
-moz-animation: fadein 10s;
-webkit-animation: fadein 10s;
-o-animation: fadein 10s;
}
@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}
}
@-o-keyframes fadein {
from {opacity:0}
to {opacity: 1}
}
</style>

Paste the above into the Head Code box and adjust the time in seconds.

-------------------------------
Roddy

Website: http://everwebwidgets.com
Contact: http://everwebwidgets.com/ewWidgets-home/contact.html
NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own.
✔ Best Answer  
User: Les C. 8 years ago
--Roddy

Yes! Many thanks.


LC


Post Reply
You must login or signup to post.