Ocultando e revelando elemento conforme direção do scroll com jQuery

por felipe - 25 jun 2014 1.836 4
851577_471200712947914_1651787391_n

Esse script faz o mesmo efeito que a barra de status do aplicativo do facebook para smartphone. Quando a tela é arrastada para cima a barrinha é oculta dando mais espaço ao conteúdo da linha do tempo, e quando volta a barra aparece.

Usei esse efeito para uma barra com menu fixo que fica no topo da página de um site, mas a altura da barra era muito alta prejudicando o espaço de conteúdo no site, com isso eu oculto alguns elementos da barra quando o scroll é rolado para baixo, e quando o scroll volta em direção do topo o elemento aparece novamente.

Segue o script:

Aqui setei o ID da minha barra com #top, quando o scroll é rolado para baixo é adicionada uma classe na barra scrollDown e quando rolada para cima remove a classe scrollDown e adiciona uma classe scrollUp.

É isso ae, qualquer dúvida deixe seu comentário.

Achei o código aqui ó.