08 maio, 2013

Tutorial : Retirar Navbar e o Espaço dela + Retirar a navbar e mostrar ao passar o mouse

Large

Oláa Amores da minha Vida :3 (Exagero não, sinceridade e carinho :D )

Já postei este primeiro tutorial de retirar a Navbar 2x , mas testei e não deu nenhum efeito. Por isso estou atualizando este tutorial. Não sei se é a nova interface ou sei lá o que, mas os outros códigos não funcionaram.
Já o de retirar a Navbar e aparecer ao passar o mouse já testei e funcionou.
Vamos ao tuto ? ...




Retirar Navbar e o Espaço dela

Bom, para quem não sabe, Navbar é aquela barrinha no topo do blog, como exemplo a seguinte imagem ^^

(Clique para ampliar)

Pode ser que alguns códigos sumam com esta barrinha mas, alguns deixam o espaço no lugar. E este tuto irá tirar a Navbar e o espaço que sobra dela.

Vá em Modelo > Editar HTML > Aperte CTRL + F da área do HTML e pesquise por :

/* Variable definitions

Acima do código pesquisado, cole o seguinte :


#navbar-iframe {
display: none !important;
}
body .navbar {
height:0px;
}
.content-outer {
margin-top:0px;
}

Visualize e se estiver dado certo, salve.
Créditos do Tutorial > Here Again!

Retirar a Navbar e mostrar ao passar o mouse

Vá em Modelo > Editar HTML > Aperte CTRL + F na caixinha da área do HTML e pesquise por :

]]></b:skin>

Acima do código pesquisado, cole o seguinte :


/* ----- Efeito de esconder e mostrar a navbar ----- */
#navbar-iframe {
opacity:0;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
#navbar-iframe:hover {
opacity:1;

E é só salvar. Se não der certo apague todo o codigo que você colou acima da tag pesquisada que é
]]></b:skin>

Espero ter ajudado, caso nenhum dos código estar válidos, não sei o problema, não sei resolver :/
Beijoos

4 comentários:

  1. Gostei do Tutorial estava mesmo procurando por esse!
    Beijos
    Mais uma Primavera

    ResponderExcluir
    Respostas
    1. Que bom que gostou flor :3
      Espero que ele tenha sido de grande ajuda ao seu blog ^^

      Excluir
  2. Tinha tentado outro tutorial que não tinha funcionado, mas o seu funcionou de primeira. : )

    Se der da uma passadinha lá. www.cherrysnow.com.br
    Obrigada.

    ResponderExcluir
  3. nosso deu muito certo, valeu
    primeira vez que vejo esse blog, curtir muito ele

    ResponderExcluir