Forum:
Ive Seen The Windows XP Layout By Cory And I Was Wondering If Anybody Knows How To Add A Loading Screen But With A Custom Image? (https://layouts.spacehey.com/layout?id=1169)
Thank You.
« Web, HTML, Tech Forum
How do I make a loading screen for my layout?
Report Topic
2 Replies
Reply by ★cazimeriz★
posted
updated
<style>
body:before {
content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed;
top: 0;
left: 0;
z-index: 100;
background-image: url('');
background-size: cover;
background-repeat: no-repeat;
background-position:center;
animation: yourAnimation 1s ease 1s 1 normal forwards;
pointer-events: none;}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }
</style>
copy and paste that and where it says
background-image: url('');
you want to put the image url in between the url(''); for example
background-image: url('https://64.media.tumblr.com/59d921976394727b485dc34d31d6abe7/tumblr_mpu5u5X1H21szfc26o2_500.gif');
also you can adjust where it says
animation: yourAnimation 1s ease 1s 1 normal forwards;
to make your laoding screen stay on longer or shorter
Permalink
Reply by Angellll
posted