滚动"位置:固定"Div位于页面上，但不能位于某个Div之上

Scroll a "position: fixed" div on a page but not above a certain div

本文关键字：Div quot 但不能 于某个 之上 于页面 固定 滚动 位置      更新时间：2023-09-26

我有一个div(一个位置:固定)在页面的中间。我想要的是，当用户向下滚动页面时，div就像任何具有固定位置的div一样向下移动，但是当用户向上滚动时，div不应该超过上面的div。也就是说，它保持在我创建它的位置。

你知道我该怎么做吗?

我当前的解决方案如下。这个解决方案的问题是，由于我硬编码top位置，div在不同的屏幕上显示不同，这是一个大问题。

CSS 

.div-fixed-position {
    background-color: #fff;
    padding: 20px;
     position: fixed; 
        right: 0;
        top: 625px; /* the problem! */
        z-index: 1000;
    width: 100%;
}

多谢

我使用这个JS来自动检测我的top CSS属性:-

JS 

var navHeight    = $('header.myheader').height();
var totalHeight = parseInt(headerHeight) + parseInt(navHeight) + 50;
$(".div-fixed-position").css({ top: totalHeight });

，我把顶部从我的CSS。

CSS 

.div-fixed-position {
    background-color: #fff;
    padding: 20px;
     position: fixed; 
        right: 0;
        z-index: 1000;
    width: 100%;
}
相关文章：