0

Peguei este código na internet, para ver o seu funcionamento. Primeiro ele só mostra depois de carregar os dados do servidor. Queria fazer um para quando ele entrar em uma página, ele mostrar o carregando até que o componente seja carregado.

#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>

O que está errado?

3
  • Será que pode linkar a fonte do snippet?
    – vinicius
    Commented 17/03/2017 às 2:21
  • Vinicius eu não lembro, achei ontem.
    – Guilherme
    Commented 17/03/2017 às 2:27
  • Tá faltando o JS, não? Aqui só vejo o CSS/HTML.
    – vinicius
    Commented 17/03/2017 às 2:28

1 Resposta 1

0

Vinicius.

<style>
#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%;
}
</style>
    <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>
    <script type="text/javascript">
        jQuery(function($) {
            $('#loading').show().;
        });
    </script>

Estava mesmo...

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .