페이지가 여전히있을 때 div를 숨기고 위로 스크롤 이동시 표시

Question

android에서 크롬 (?)과 같은 끈적한 헤더를 만들고 싶습니다.

즉, 페이지를 아래로 스크롤하면 끈적한 헤더가 없지만 위로 스크롤하면 (또는 1 초 후에) 끈적한 헤더가 다시 나타납니다.

그런 다음 아래로 스크롤하면 한 번 더 숨 깁니다.

이것은 훨씬 더 끈적한 헤더 솔루션이지만 웨이 포인트를 참조하는 자습서 만 찾을 수 있다고 생각합니다. 고정 된 위치가 아닌 움직임에 기반한 무언가를 원합니다.

누군가가 나에게 뼈 예를 들어 줄 수 있습니까?

감사합니다.

Answer 1

확인이 필요한 것입니다 Working Fiddle .I 희망 ..

var scroll_pos = 50; 
var scroll_time; 
if($('.gridContainer').is(':visible')) 
$('.gridContainer').addClass('hidden'); 
$(window).scroll(function() { 
    clearTimeout(scroll_time); 
    var current_scroll = $(window).scrollTop(); 

if (current_scroll >= $('#topNav').outerHeight()) { 
    if (current_scroll <= scroll_pos + 100) { 
     $('.gridContainer').removeClass('hidden');  
    } 
    else { 
     $('.gridContainer').addClass('hidden'); 
    } 
} 

scroll_time = setTimeout(function() { 
    scroll_pos = $(window).scrollTop(); 
}, 600); 

});