12.6.12

Como Mudar de Background em Um Click?

Sabe aquele background lindo que você tem e você fica com dúvida nesse e em outro
agora você pode colocar os 2 ou 3...
o gadget vai ficar assim:
Super Maneiro né para ver o Tutorial Tudo clique em
Leia Mais.
Vamos Começar??
Vá em Layout>Adicionar Gadget>HTML/Javascript
e cole esse código:
<style>
#estilo a img{
width:40px;
height:40px;
display:inline;
margin-right:10px;
margin-top:15px;
border: 2px solid #EEE;
}
#estilo a:hover img{
border: 2px solid #bdebff;
}

</style>
<div id="estilo">
<script src='http://code.jquery.com/jquery-1.6.2.min.js' type='text/javascript'></script>
<script>
$(document).ready(function(){
$("#bgcolor1").click(function(){
$("body").css({"background":"url(http://i748.photobucket.com/albums/xx122/luuuh/backgrounds/maenvenenadabackgrounds46.gif)"});
});
});
$(document).ready(function(){
$("#bgcolor2").click(function(){
$("body").css({"background":"url(http://i748.photobucket.com/albums/xx122/luuuh/backgrounds/maenvenenadabackgrounds36.gif)"});
});
});
$(document).ready(function(){
$("#bgcolor3").click(function(){
$("body").css({"background":"url(http://i748.photobucket.com/albums/xx122/luuuh/backgrounds/03.png)"});
});
});
</script>

<center><a href="javascript:void(O)" id='bgcolor1' title="Normal"><img src="http://i748.photobucket.com/albums/xx122/luuuh/backgrounds/maenvenenadabackgrounds46.gif" /></a>
<a href="javascript:void(O)" id='bgcolor2' title="Título Aqui"><img src="http://i748.photobucket.com/albums/xx122/luuuh/backgrounds/maenvenenadabackgrounds36.gif" /></a>
<a href="javascript:void(O)" id='bgcolor3' title="Título Aqui"><img src="http://i748.photobucket.com/albums/xx122/luuuh/backgrounds/03.png" /></a></center>
</div>
Vermelho - Você irá colocar a url do fundo1, as cores se repetem então nos dois a mesmo url
Laranja - Você irá colocar a url do fundo2, as cores se repetem então nos dois a mesmo url
Verde - Você irá colocar a url do fundo3, as cores se repetem então nos dois a mesmo url
Rosa - Quando passarem o mouse sobre a imagem irá aparecer uma janelinha escrito o que você quer que seja escrito então edite...
Lilás - Estilo da borda sem passar o mouse
Azul - Estilo da borda ao passar o mouse

Créditos:TG

4 comentários:

  1. Oi Ana, percebi q já colocou o Garotas H-I-S em seus afiliados, vou colocar vc lá tbm ♥

    ResponderExcluir
  2. Ahh me esqueci, passa lá e escolhe uma imagem na página de afiliados ♥

    ResponderExcluir
  3. Fica lindo! Oii, estou seguindo e amando o blog! Pode seguir de volta:
    http://fluffy-s2-world.blogspot.com.br/

    URGENTE:
    DIVULGUE ESSA POSTAGEM:
    http://fluffy-s2-world.blogspot.com.br/2012/06/adote-um-cachorro-tambem.html#more

    KISSES!

    ResponderExcluir

Antes de comentar siga essas regrinhas:
- Aceito segue,segue de volta
- Quando Pedir alguma coisa especifique
- Retribuo todos os comentários
- Pedidos de Afiliação só na Página de Afiliações
- Não use palavras ofensivas
- Não me peça para Divulgar porque não aceito Divulgações