Clique aqui e escolha a sua no Site TonyGifsJavas.com.br

sexta-feira, 27 de janeiro de 2012

Banners deslizando


Atualmente muitas pessoas fazem parcerias trocando banners com outros sites e muitas vezes esses bannes ocupam bastante espaço no blog. Uma boa maneira de resolver esse problema é usar um sistema de rolagem de banners, isso faz ocupar menos espaço no blog e ao mesmo tempo tem um efeito visual muito bom. Outra alternativa interessante é fazer Apresentação de Slides com Banners.


Agora veja abaixo faz que os banners fiquem deslizando pela tela e o melhor você define o espaço que eles ocuparão e outras coisas.

<marquee style="border: 2px solid #000000; background-color: #FFFFCC;text-align: 
center;height: 200px;width: 150px" scrolldelay="1"scrollamount="1"behavior="scroll"direction="down"onMouseOver=this.stop() onMouseOut=this.start()>
<p><a href="http://mensagens.110mb.com" target="_blank"><img 
src="bannerfrases.jpg" border="0"></a></p>

<p><a href="http://jornaljd.blogspot.com" target="_blank"><img 
src="http://i55.photobucket.com/albums/g138/robertojd/jornal.jpg" border="0"></a></p>

<p><a href="http://frasecurta.blogspot.com" target="_blank"><img 
src="http://i55.photobucket.com/albums/g138/robertojd/banner-1.jpg" 
border="0"></a></p>

<p><a href="http://dicasparablogs.blogspot.com" target="_blank"><img 
src="http://i205.photobucket.com/albums/bb145/cidadeweb/bannerdicas.gif" 
border="0"></a></p>

</marquee> 

Vamos entender e aprender como modificar esse código:
Borda: border: 2px solid #000000
2 é a largura, solid é o estilo normal(experimente trocar 2px solid por 5px double, são duas linhas como borda)

Cor de fundo: background-color: #FFFFCC

Alinhamento: text-align: center
Poder ser left(esquerda) ou right(direita)

Altura: height: 200px
Largura: width: 150px
Altura e largura pode ser qualquer valor, mas não retire o px no final, é uma medida de pagina(pixels)

scrolldelay="1"scrollamount="1"direction="down"
Os valores 1 no trecho acima são a velocidade que os banners se movimentam e a palavra down é a direção que pode ser alterada para up(para cima), left(para esquerda), right(para direita).
Espero que gostem e aproveitem essa sugestão de como economizar e melhorar a aparência de seu blog. Clique aqui e veja um exemplo desse código funcionando. 

Related Posts Plugin for WordPress, Blogger...

Nenhum comentário:

Postar um comentário

Blog de assuntodemulher :Porque nos entender?, frase do dia