10/28/2012

Tutorial- Mudar o fundo em um clique

                     
Olá meus amorecos!
Sabe aqueles três buttons na barra lateral do blog?aqueles que servem para mudar o fundo do blog.Estes daqui:
                                               
Pois hoje vou ensinar como coloca-los em seu blog.
Adicione uma html/java script e cole o seguinte código:
<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 primeiro background)"});
});
});
$(document).ready(function(){
$("#background02").click(function(){
$("body").css({"background":"url(URL do segundo background)"});
});
});
$(document).ready(function(){
$("#background03").click(function(){
$("body").css({"background":"url(URL do terceiro background)"});
});
});
</script>

<center><a href="javascript:void(O)" id='background01' title="1"><img src="URL do primeiro background" /></a>
<a href="javascript:void(O)" id='background02' title="2"><img src="URL do segundo background" /></a>
<a href="javascript:void(O)" id='background03' title="3"><img src="URL do terceiro background" /></a></center>

Agora, é só editar o código. Azul: Cor da Borda.
                                                   Laranja: Cor da Borda quando passa o mouse.
                                                   Vermelho: Endereço do background.

Foi só isso Bye-BYe




Nenhum comentário:

Postar um comentário

Olá,tudo bem?
Se comentar fique sabendo,que não me importo com:
"Segui de volta" ou etc.
Sou toda ouvido á duvidas e sugestões.
KIssus