Imagem ou Menu Flutuante
Você provavelmente ja deve ter visitado algum site ou blog em que, quando você rola a página para cima ou para baixo, há um menu ou uma imagem que rola junto coma a tela. São as imagens ou menus flutuantes.
Se você deseja adicionar isso no seu blog, encontrei na internet como adicionar esse efeito. Pode ser muito útil para passar alguma mensagem importante para seus visitantes, ou anúncio ou o menu de categorias do seu blog, por exemplo.
Você pode escolher deixar rolando imagens, widgets, links ou mesmo um pequeno menu. Então vamos lá! Antes de mais nada, salve o seu blog.
Vá em “Layout” e “Editar HTML” e clique em “Expandir modelos de widgets” e procure por:
]]></b:skin>
Logo acima dessa linha cole o seguinte código:
#float_corner {
position:fixed;_position:absolute;bottom:0px;left:0px;clip:
inherit;_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);_left:expression(document.documentElement.scrollLeft + document.documentElement.clientWidth - offsetWidth);}
Altere a marcação vermelho que é a posição em relação à tela: “left”, “right”, “top”, “buttom”.
Agora encontre a linha “<body>” e abaixo dela, cole o seguinte código:
<div id="float_corner">
IMAGEM OU WIDGET A FLUTUAR
</div>
Na marcação em vermelho, coloque o código daquilo q for ficar flutuando na tela.
Salve as alterações e pronto!!!
3 comentários:
e como faz pra aparecer o recado na frente de tudo e o leitor ter a opçao de fexar?
9 de agosto de 2009 19:50Eu ja vi um blog com esse recursos, mas confesso que não sei como fazer.
10 de agosto de 2009 19:09Por favor, se vc descobrir antes de mim, mande recado aqui que eu te dou os créditos da postagem.
Tentei passo a passo como diz acima, mas não consgui.
9 de setembro de 2009 17:12Deve ter algum erro nestes codigos não!?
Postar um comentário
Envie um comentário!