當到達文檔頂部時，需要激活放置在頂部圖像下方的自動/隱藏標題

Question

我有這個自動/隱藏標題，它位於頂部圖像下方的絕對位置。

.header-sticky { 
     margin: -30px 0px 0px; 
     padding: 0px 55px; 
     background: #fff; 
     position: absolute; 
     z-index:9; 
     width: 52.4%; 
     right: 0; 
     height: 100px; 
     overflow: hidden; 
    } 

現在它激活與偏移設置自動/隱藏功能，但我想激活此當頭部到達文檔的頂部。

這怎麼辦？

這裏是一個小提琴：https://jsfiddle.net/dp174zjx/1/

的問題是，我需要激活下面的類時，頭到達頂部：

.header-sticky--hidden { 
    -webkit-transform: translateY(-100%) !important; 
    -ms-transform: translateY(-100%) !important; 
    transform: translateY(-100%) !important; 
    } 

    .header-sticky--narrow { 
    position: fixed; 
    z-index:9; 
    top: 0px; 

    } 

Answer 1

，它可以像這樣

$(window).scroll(function() { 
    var offset = $('.header-sticky').offset().top; 
    if ($(window).scrollTop() >= offset) { 
     //Hide the header 
    } 
});