terça-feira, 19 de setembro de 2017

#Tuto: Gadget que troca o background do blog - 2

E aí, pãezinhos de mel! Tudo certinho com vocês?

Hoje de manhã fiquei com uma dor de cabeça que meu Deus! Achei que minha cabeça fosse explodir, parece que tinha um martelo batendo forte na cabeça, porquê nossa senhora! Preciso contar para vocês que eu fiquei acho que 2 noites sonhando com minha turma da escola, ai credo, é um sonho diferente, nem parece realmente com a realidade que é os outros sonhos. Tá mais para um pesadelo, não é algo com que eu me sinta á vontade esse pesadelo na escola... 💔

Então, honey's, como dito, vim aqui trazendo o tutorial gadget que troca o background do blog 2! Já tinha postado o outro tutorial que é um gadget que troca o background do blog também, só que aquele é de cores, esse que eu estou trazendo é de imagens, então vocês aproveitem para personalizar e serem felizes com esses tutoriais... Bora lá começar o tuto? Créditos

~ Preview retirado do Adolescente Nerd ~

Vá em LayoutAdicionar um gadget ≫ Clique em HTML/JavaScript e dentro da caixinha de texot cole o seguinte código:
<div class='widget HTML' id='HTML7'>
<h2 class='title'>Mude o Fundo!!</h2>
<div class='widget-content'>
<style>

#backgrounds a img{
width:40px;
height:40px;
display:inline;
margin-right:10px;
margin-top:15px;
border:2px solid #FFFFFF;
}

#backgrounds a:hover img{
border:2px solid #FFEC8B;
}

</style>

<div id="backgrounds">

<script src='http://code.jquery.com/jquery-1.6.2.min.js' type='text/javascript'></script>

<script>
$(document).ready(function(){
 $("#background01").click(function(){


$("body").css({"background":"url(URL DO FUNDO 1)"});
 });
});
$(document).ready(function(){
 $("#background02").click(function(){


$("body").css({"background":"url( URL DO FUNDO 2)"});
 });
});
$(document).ready(function(){
 $("#background03").click(function(){


$("body").css({"background":"url( URL DO FUNDO 3)"});
 });
});
</script>

<center><a href="javascript:void(O)" id='background01' title="1"><img

src="URL DO FUNDO 1" /></a>

<a href="javascript:void(O)" id='background02' title="2"><img

src="URL DO FUNDO 2" /></a>

<a href="javascript:void(O)" id='background03' title="3"><img

src="URL DO FUNDO 3"

/></a></center></div>
</div></div>
Personalize colocando as url do background onde está em negrito e também personalizando outras coisas ao seu gosto! Visualize, se estiver tudo certo é só salvar e prontinhoo...
~ Kissus de luz! 

Nenhum comentário:

Postar um comentário