I need some help in a prealoder code I don’t know much code, indeed this one is my first time trying to do it. As you all may know wix pages can take long time loading, and you can loose some visitors because of this. So I am trying to put a prealoader to people know the page is loading and don’t leave.
I take a preaload code that was working and try to change the design and there something went wrong can’t really figure out what it is. If someone could help me I’ll be really thankful
Here is the code:
W
I
S
D
O
M
@import url(https://fonts.googleapis.com/css?family=Futura);
@mixin position-center($text-align: center) {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
text-align: $text-align;
}
.loading {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #ffffff;
z-index: 9999;
}
.wisdom-text {
@include position-center;
width: 100%;
height: 100px;
line-height: 100px;
span {
display: inline-block;
margin: 0 10px;
color: #000000;
font-family: 'Futura', sans-serif;
font-size: 40px;
@for $i from 0 through 6 {
&:nth-child(#{$i + 1}) {
filter: blur(0px);
animation: blur-text 2s (#{$i/5})+s infinite linear alternate;
}
}
}
}
@keyframes blur-text {
0% {filter: blur(0px);}
100% {filter: blur(4px);}
}</div>