Tutorial: Ocultar a navbar e mostrá-la ao passar o mouse

6 de jul. de 2011

Hi people! Quero pedir desculpas pelo tempo que passei sem postar, sabe quando parece que as coisas que eram pra acontecer ao longo de um mês inteiro acontecem em dias seguidos? Pois é, minha semana foi assim :s
-Ta Ani, para de ficar enrolando e volta logo pro post!

Ok, hoje eu vou postar um tutorial muito simples e útil, sabe aquela barra lá no topo do blog onde você faz o login, cria uma nova postagem e tal? Que ela não é muito agradável aos olhos todo mundo sabe, mas muitos tem  
um certo receio de tirá-la por poder dificultar o acesso aos "atalhos" dela. Confesso que eu sofria disso kkk' mas hoje eu estava pesquisando e achei um tutorial ensinando a ocultar e mostrá-la novamente quando passado o mouse no lugar onde ela fica, lembrando que os créditos são todos do blog Bloggando na web.

Clique em "Leia Mais" para ver o post completo.

Então, vamos começar?

1. Abra o seu blog, faça o login e vá em Design  > Editar HTML

2. Pressione "Ctrl+F" para abrir a caixa de pesquisa e procure pelo seguinte código:



      ]]></b:skin>                                              


3. Logo acima deste código, adicione este outro código:
                                                                                     

#navbar-iframe {
opacity:0;
}

#navbar-iframe:hover {
opacity:1;
}


4. Visualize e se estiver tudo certo salve (:

Viu só? Simples, fácil e rápido. Espero que tenham gostado tanto quanto eu *-*

Ah, só um aviso, o código não funciona no Internet Explorer ):

25 comentários:

  1. heey flor, foi um tuto muito útil, obg, seguindo também, adorei,o blog (literalmente), seguindo também, passa lá http://meublogblogdadanii.blogspot.com/, visite e deixe uma blogueira feliz!

    ResponderExcluir
  2. Acho q o meu ta dando erooo na visualizaçãoo....o código funciona do mozilla firefox? ahh, visite o meu blog, é www.happy-charllote.blogspot.com

    ResponderExcluir
  3. Deu super certo !!

    http://www.pipocaatualizada.blogspot.com/

    ResponderExcluir
  4. Não deu certo e eu fiz tudo direitinho!!!!!

    ResponderExcluir
  5. Geronda, tem uns templates que não dão certo mesmo! Principlamente os editados :/

    ResponderExcluir
  6. Adorei esse tuto! Estou usando :**

    http://blog-da-mands.blogspot.com <- blog novo!

    ResponderExcluir
  7. Amei seu blog, muito muito maravilhoso *-*
    Seus tutoriais tem me ajudado muito, parabéns!
    Seguindo, é claro. Retribui?
    http://twofriendsonediary.blogspot.com/

    ResponderExcluir
  8. Consegui ebaa obriga flor :)
    amei o tutorial
    Segui meu blog se puder flor?
    http://modaecompaniaup.blogspot.com.br/

    ResponderExcluir
  9. amei demais isso! seu blog é um amor *-*

    beijinhos :*

    ResponderExcluir
  10. ótimo *-*
    Bjs!
    http://bolinhosdemorangos.blogspot.com.br/

    ResponderExcluir
  11. AAh funcionou *u* Muuito obrigada !

    robertadream.blogspot.com.br/

    ResponderExcluir
  12. Sofria o mesmo que você haha, agora isso mudou *-*
    adorei o tutorial.

    http://our-teen-dream.blogspot.com.br/

    ResponderExcluir
  13. realmente perfeito esse tutorial (risos) ♥
    http://umaflordodeserto.blogspot.com.br/

    ResponderExcluir
  14. ?E Como colocar uma imagem para quando passar o mouse aparecer?

    ResponderExcluir
    Respostas
    1. Vê esse tutorial aqui:

      goimagines.blogspot.com.br/2011/12/menu-em-imagem-com-estado-hover.html

      Excluir
  15. FICOU PERFEITO *.*
    OBRIGADA!!!!!
    =D

    xoxo,
    Daniela

    ResponderExcluir
  16. Puxa, é impressionante como tudo dá certinho! Você é muito inteligente. Obrigada mesmo!

    ResponderExcluir
  17. Amei o tutorial foi muito util ^.^

    ResponderExcluir
  18. Ameii o tutorial muito legal!

    http://nandawebsluarcmf.blogspot.com.br/

    ResponderExcluir
  19. Hahahahahahaha Consegui! Obrigado :')

    ResponderExcluir
  20. Obrigado você me ajudou de mais,parabéns pelo seu blog lindinha está uma fofura,Beijos...

    http://agarotadebatomroxo.blogspot.com.br/

    ResponderExcluir

- Comentários do tipo "seguindo, segue de volta" "lindo o blog, seguindo, retribui?" Serão ignorados se não tiverem uma opinião sobre o post em si.
- Não aceitamos mais selinhos e tags, sorry!
- Leia a página "FAQ" e outras páginas internas antes de perguntar qualquer coisa.
- Sua opinião é sempre bem vinda. Mas seja educado!

© Go Imagine - 2014. Todos os direitos reservados.