僅在水平滾動后如何定位div元素？

Question

我正在尋找一種僅在向右滾動約100％之后將頁面的#header元素定位為“固定”的方法。

如果<100％然后

#header { display:none; }

如果左> 100％

#header { position:fixed, top:0, left:0, width:50px, height:50px, color:red, z-index:9999; }

我嘗試了這個：

<script type='text/javascript'>
var header = $("#header");
$(document).scroll(function() {
    if($(this).scrollLeft() > 1920) {
        header.css({"position" : "fixed", "top" : "0", "left" : "0", "width" : "50px", "height" : "50px", "background" : "red", "z-index" : "9999"});
    } else {
        header.css({"display" : "none"});
}
});
</script>

但這是行不通的。 是否可以用百分比而不是像素數量來構成條件？ （而不是1920年的100％）

請問你能幫幫我嗎 ？

Answer 1

嘗試將1920替換為“ window.innerWidth”。 多數民眾贊成在JS DOM變量的瀏覽器窗口的寬度。