I got this code on the internet, to see how it works. First it only shows after loading the data from the server. I would like to make one for when it comes into a page, it will show the loading until the component is loaded.
#loading {
background: none no-repeat scroll 50% 50% rgba(255, 255, 255, 0.8);
height: 100px;
left: 500px;
position: fixed;
top: 500px;
width: 200px;
z-index: 1000;
text-align: center;
}
#loading #fraseLoader {
font-size: 25px;
}
#loading #imagemLoader {
margin-top: 20%;
}
<div id="loading" style="display: none;">
<i class="ace-icon fa fa-spinner fa-spin orange bigger-125"></i>
<p id="fraseLoader">Processando, aguarde...</p>
</div>
What's wrong?