如何讓div滾動時粘在螢幕頂部？

將Div 固定到螢幕頂端

要達到所需的效果，請將div 放置在其他內容下方並設定其初始位置為絕對或相對。一旦頁面滾動到足以使 div 的頂部邊緣與視窗對齊，請將位置修改為固定並將頂部值重設為零。

CSS:

.sticky-div {
    position: absolute;
    top: initial;
    width: 100%;
}

.sticky-div.fixed {
    position: fixed;
    top: 0;
}

JavaScript (jQuery):

$(window).scroll(function() {
    var div = $('.sticky-div'),
        scrollTop = $(this).scrollTop();

    if (scrollTop > 200) {
        div.addClass('fixed');
    } else {
        div.removeClass('fixed');
    }
});

當scroll變得固定並隨視窗滾動。向後捲動將刪除固定類別，恢復其原始位置。

以上是如何讓div滾動時粘在螢幕頂部？的詳細內容。更多資訊請關注PHP中文網其他相關文章！