Nuvens Flutuando no Cabeçalho do Blogger
Nesta postagem venho mostrar aqui vocês este tutorial ali do site Templates e Acessórios da qual eu achei bem interessante compartilhar aqui com vocês. Está na cara que o código é bem elegante sem falar que também deixa o template bem criativo.
Para colocar o efeito no seu blog... Entre em "Modelo" - "Editar HTML", dê um Ctrl + F e procure pela tag
</head>
Tendo encontrado a tag, cole ACIMA dela o seguinte código
<script src='http://jqueryjs.googlecode.com/files/jquery-1.3.2.js' type='text/javascript'/>
<div id='wrapper'>
<div id='content'>
<div id='cloud1'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4HRdBXMRK4bSQP999vXg4b1kEQ3El0FZCFW5qWE8cNYIfmjNnXtYqIk4jDUhB91Fn8FiHPj2n2BDtbJFwyWlnBqCNmoyWTb50ewQ0sYRHEb1JvbsTreA8HzwBxe8dDWgUBhyvScFb6nc/s1600/nuvem+2.png'/></div>
<div id='cloud2'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0WtKujDiSOFQS8GX7huZXRgRU_kQjiSPst8esxnoIJpk0riIMvvGwY1YkJ34b_azBqR_02Wm96PedP5tc9w3VnnoFDLIpr8JLC0-l3BNwawVhTqRw2Ysk3uajYd1bG6ak2YtPiACMF1Q/s1600/nuvem+1.png'/></div>
<div id='cloud3'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4HRdBXMRK4bSQP999vXg4b1kEQ3El0FZCFW5qWE8cNYIfmjNnXtYqIk4jDUhB91Fn8FiHPj2n2BDtbJFwyWlnBqCNmoyWTb50ewQ0sYRHEb1JvbsTreA8HzwBxe8dDWgUBhyvScFb6nc/s1600/nuvem+2.png'/></div>
<div id='cloud4'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0WtKujDiSOFQS8GX7huZXRgRU_kQjiSPst8esxnoIJpk0riIMvvGwY1YkJ34b_azBqR_02Wm96PedP5tc9w3VnnoFDLIpr8JLC0-l3BNwawVhTqRw2Ysk3uajYd1bG6ak2YtPiACMF1Q/s1600/nuvem+1.png'/></div>
</div>
</div>
<script type='text/javascript'>
$(document).ready(function() {
setTimeout("animation()",300);
});
function animation(){
cloud1();
cloud2();
cloud3();
cloud4();
}
function cloud1(){
$("#cloud1").animate({left:"+=80%"},50000).animate({left:"-0px"}, 0)
setTimeout("cloud1()",30000);
}
function cloud2(){
$("#cloud2").animate({left:"+=70%"},40000).animate({left:"-0px"}, 0)
setTimeout("cloud2()",20000);
}
function cloud3(){
$("#cloud3").animate({left:"+=70%"},60000).animate({left:"-0px"}, 0)
setTimeout("cloud3()",20000);
}
function cloud4(){
$("#cloud4").animate({left:"+=70%"},75000).animate({left:"-0px"}, 0)
setTimeout("cloud4()",75000);
}
</script>
Agora, procure pela tag ]]></b:skin>
Tendo encontrado o código, ACIMA dele cole o seguinte código/*Nuvens Flutuando no cabeçalho do blogger-------------------------------*/
#cloud1{ position:absolute; top:2px; left: 0px; z-index:10; }
#cloud2{ position:absolute; top:80px; left: 0px; z-index:10; }
#cloud3{ position:absolute; top:150px; left: 0px; z-index:10; }
#cloud4{ position:absolute; top:220px; left: 0px; z-index:10; }
Agora, basta salvar e pronto!!!