Colocar um menu fixo na lateral do site/blog

Esse menu assim dito por mim e na verdade um incremento do código que faz a pagina voltar para o topo rapidamente.

 

Depois de alguns teste com o código,  percebi que daria para colocar qualquer coisa na lateral e ficar bem destacado,  como esse que você ver ai do lado direito do site(topo, home, twitter, contato, cbox), mas pode ser qualquer coisa mesmo, um anuncio, imagens , ou só escrita mesmo.

 

Achei muito eficiente este menu, e tenho planos para o futuro, mas deixa para o próxima dica, vamos aos códigos.

 

O código original e assim:

<div style="position:fixed; bottom:0px; right:0px;"><a href="#">TOPO</a></div>

 

Desse jeito ele fica colado na lateral direita, position:fixed(posição:Fixo)

Bottom:0px ( botão:0px) e right:0px(direita:0px).

 

Lembrado que pode colocar ele em qualquer lado, basta trocar  o right, por left.

 

Vamos a implementação e um melhor uso desse código.

 

E muito simples , e só continuar o código  depois de </a><P>, eu adicionei  no bottom20px e right: 6px para  nao ficar muito colado na lateral,

 

e uma cor branca no escrito pois o meu site e vermelho e ia fica tudo vermelho, mas isso e opcional, dependera do seu fundo do site, ai o código ficou assim:

 

<div style="position: fixed; bottom: 20px; right: 6px;"><a style="color: rgb(255, 255, 255);" href="#">Topo</a><p>

 

<a style="color: rgb(255, 255, 255);" href="http://www.oficina-blogger.com/">Home</a></p>

<a href="mailto:tudomio@bol.com.br"target="_blank"><img alt="Contato" src="http://img207.imageshack.us/img207/1779/contatos.gif" title="Contato"/></a><p>

 

<a href="http://twitter.com/oficinablogger"target="_blank"><img alt="twitter" src="http://img8.imageshack.us/img8/2990/twittermd.gif" title="twitter"/></a><p>

 

<a href="http://oficina-blogger.cbox.ws/" target="_blank"><img alt="Cbox" src="http://img30.imageshack.us/img30/6677/title4.gif" title="Cbox"/></a><p>  </div>

 

O importante e fecha o código com o </div> e cola num gadget   HTML/JavaScript , e tudo correra tudo perfeito.

 

 

Se acha um pouco complicado copie o código e só troque o que esta em vermelho, que sao os links e as imagens, e faça um bom uso.

 

Uma postagem muito interessante com esse código de volta a pagina para o topo você vera no:

 

                         Dicas para blogs  e varias outras de muita valias para nos blogueiros.

 

Ate a próxima e qualquer duvida comente, que estarei  sempre a ajudar.