09/12/2012

Tutorial: Objeto flutuante (colocar menu acima do cabeçalho)

||

Bom vou mostrar como colocar um objeto flutuante no blog, como o que fiz aqui no meu theme Ice Cream, eu achei 2 formas diferentes, da para colocar dos mais simples efeitos como ate um slide. Não a grande mistério em fazer isso, quer ver?


Objeto flutuante  (Rola com a página)

Antes do código que você deseja que flutue, como um gadget de menus. Coloque esse código acima dele:

<div style="bottom: 500px; position: fixed; right: 20px;">

E no final dele coloque isso:

</div>

Objeto flutuante (Fixo)

Esse e perfeito para um slide ou gadgets que você quer que apareçam no cabeçalho do blog, um exemplo aqui Ice Cream. Esse e o mesmo processo do outro, antes do código do gadget coloque esse acima:

<div style="position: absolute; margin-top: -150px; left: 2px;">

E no final do codigo coloque:

</div>

Os números em negrito são para arrumar as posições e altura, não existe medida certa, o ideal e ir aumentando, diminuindo e ajeitando ate encaixar onde deseja, pós cada layout tem uma largura e tamanho ^^

8 comentários:

  1. Amei o tutorial, eu estava suuuper precisando obg, vou usar! Perfeito o seu novo lay, amei amei, estou até com inveja, beijos :*

    Tem enquete no blog, vota lá!

    Amantes de Moda ||

    ResponderExcluir
    Respostas
    1. Hayooo, que bom que o tutorial sera util para você.
      Hihi obrigada fico contente que tenha gostado.

      Excluir
  2. Muito legal, gostei mesmo da dica. Ainda sou meio noobinha em html, blogger e etc., qual quer dica me é sempre útil. :P

    Beijinhos

    http://vitoriaeseudiario.blogspot.com.br/search/label/8º Postagem pt. 1
    -
    http://vitoriaeseudiario.blogspot.com.br/search/label/8º Postagem pt. 2

    ResponderExcluir
    Respostas
    1. Hihi verdade, MAS ate as mais experientes, também precisam se enovar as vezes.

      Mas fico contente em ter ajudado

      Excluir
  3. eu gostaria de fazer uma parceria, meu blog é:
    http://porco-pimenta.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Yo! Yo! Aceito sim, dexarei recadinho lá no seu blog

      Excluir
  4. puxa Drw , o meu funciou mas quando clica no post ( pagias internas) ele desajusta ;-;
    o que eu faço ? ;-;

    ResponderExcluir
    Respostas
    1. Olá Celly, você usou a opção Objeto flutuante (Rola com a página) ou o Objeto flutuante (Fixo)?

      Excluir

Hi guys!!!!
Hey aqui é Wendy, blogueira desde 2010! Viciada em animes, amante de livros e adora ver séries! Criei esse cantinho na intenção de ajudar na criação e personalização de blogs e sites.
Wattpad Facebook Tumblr Instagram