Jump to content

Recommended Posts

Boa tarde!
Como faço para meu header aparecer quando o scroll estiver parado e quando a pessoa rolar a página (para cima ou para baixo) o header ocultar até que o scroll pare novamente? Obrigado!
(js vanilla)
 

Share this post


Link to post
Share on other sites

Consegui o que precisava da seguinte forma:

 

var cabecalho = document.getElementsByClassName("cabecalhoMain")[0];

window.onscroll = function(){
	if(window.pageYOffset){
		cabecalho.removeAttribute("style");
        window.setTimeout(function(){
        	cabecalho.style.position = "fixed";
            clearTimeout(this);
        },2500);
    }
};

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By adrianomonteiroweb
      Galera, é possível realizar o efeito scroll suave até uma div após algum tempo determinado que a página carregar?
    • By Marcos Vinícius
      Pessoal,
       
      Já tentei de todas as formas que encontrei mas não consegui evitar que a impressão do browser saia sem o cabeçalho/rodapé. Sei q o usuário pode tirar isso das configurações de impressão mas serão muitos usuários e deixar pra que isso seja feito manualmente é complicado. Alguém sabe uma solução pra isso?
    • By lordgreen
      Olá, andei procurando e não encontrei exatamente o que preciso então, talvez alguém possa me ajudar.
      Eu quero colocar um site em modo horizontal e não consigo pensar em como fazer isto. Deixe-me explicar melhor, tenho uma imagem com altura de 960px e largura de 5000px, ponho ela como background da página e fica a barra em baixo e não em cima, gostaria de saber como mover essa barra para o lado com a roda do mouse (no ato do scrolling). 
      Deve ser uma coisa bem simples, porém realmente não consigo fazer e não encontro exatamente o que procuro na internet, só encontro como colocar menu na horizontal, enfim.
       
      Obrigado a todos.
    • By 4ly
      Olá. Bom basicamente eu tenho um botão âncora que leva até a aba de sobre do meu site, só que ele não tem animação, ele simplesmente "teleporta" para essa aba do nada isso não é legal. 
      Gostaria de saber algum código de JavaScript ou CSS para solucionar isso 
      Esse é o código : 
       
      <button id="explorer"><a href="#about">Explorar</a></button>
    • By DinhoPHP
      Estou com o seguinte problema.
      Desenvolvi um site em flex box com width de 100% na Section.  O problema é que o header com 100% fixed ultrapassa a section ficando mais larga que tudo na página no modo mobile mesmo utilizando break points.
       
      @media screen and (max-width: 984px){ header{ background-color: #1a1a1a; width: 100%; position: fixed; top: 0px; z-index: 999; display: flex !important; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space--around; line-height: 6; font-size: 0.8em; } }  

×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.