.

terça-feira

Colocar Efeito Loading No Blogger e Personalizar do Seu Jeito

ACESSOS:
AQUI

Imagem tirada do site turbo-ofilme.com.br

Nesta postagem estarei mostrando para vocês uma forma bem interessante de colocar efeito carregando na página do seu site. A forma que ire mostra fica muito fácil para personalizar. Vou mostrar passo a passo.


Você já viu a demonstração, para ver de novo, recarregue a página para ver o efeito novamentel!!!

Deu para ver o efeito?

Para colocar em seu blog é bem fácil mesmo. Eu resumi o código para ficar mais fácil compreender o Javascript.




Para colocá-lo, entre em "Editar HTML" e procure pela tag


<body>

Se não encontrar, procure por

<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>

Tendo encontrado, cole o seguinte código ABAIXO

<style>
.loader {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 9999;
background: url('http://www.turbo-ofilme.com.br/images/loader.gif') 50% 50% no-repeat black;
}
</style>
<script src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>
<script type='text/javascript'>
$(window).load(function() {
 $(".loader").fadeOut("slow");
})
</script>
<div class='loader'></div>


A parte destacada de vermelho, corresponde ao javascript. Caso você já tenha o javascript em seu blog, apague esta parte para não dar conflito. A parte destacada de azul, corresponde a imagem que ficará no meio. E o mais importante, a cor de fundo (parte destacada de rosa); Isso quer dizer que se você for colocar uma imagem de sua preferência, mude a cor do fundo também para ficar mais bonito de se ver.