js实现页面向下滚动时，当前页面中间的div不动，下面的div将页面中间的div覆盖

可以使用CSS中的position属性来实现这个效果。首先，设置中间的div为绝对定位，然后设置其left和top属性使其居中。接着，设置下面的div为相对定位，并设置其z-index比中间的div小，这样就可以覆盖中间的div了。

HTML代码如下：

<div class="container">
  <div class="center">中间的div</div>
  <div class="bottom">下面的div</div>
</div>

CSS代码如下：

.container {
  position: relative;
  height: 2000px; /* 为了让下面的div能够覆盖中间的div，需要设置一个足够大的高度 */
}

.center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 200px;
  height: 200px;
  background-color: #ccc;
}

.bottom {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 500px;
  background-color: #f00;
}

这样，在页面向下滚动时，下面的div会覆盖中间的div，而中间的div不会动。

相关问题

js点击盒子页面向下滚动一段距离，并且添加滚动时间

您可以使用JavaScript中的addEventListener()方法来添加点击和滚动事件，并使用scrollBy()方法来向下滚动页面。以下是一个示例代码：

HTML代码：

<div id="box">点击滚动</div>

JavaScript代码：

var box = document.getElementById('box');

// 添加点击事件
box.addEventListener('click', function() {
  // 向下滚动500像素
  window.scrollBy(0, 500);
});

// 添加滚动事件
window.addEventListener('scroll', function() {
  // 滚动时触发的事件
  console.log('页面正在滚动');
});

当您点击具有ID“box”的元素时，将向下滚动500像素。同时，当您滚动页面时，将在控制台中打印出“页面正在滚动”的消息。

js点击盒子页面向下滚动一段距离，并且添加滚动事件

您可以使用JavaScript中的addEventListener()方法来添加点击和滚动事件，并使用scrollBy()方法来向下滚动页面。以下是一个示例代码：

HTML代码：

<div id="box">点击滚动</div>

JavaScript代码：

var box = document.getElementById('box');

// 添加点击事件
box.addEventListener('click', function() {
  // 向下滚动500像素
  window.scrollBy(0, 500);
});

// 添加滚动事件
window.addEventListener('scroll', function() {
  // 滚动时触发的事件
  console.log('页面正在滚动');
});

当您点击具有ID“box”的元素时，将向下滚动500像素。同时，当您滚动页面时，将在控制台中打印出“页面正在滚动”的消息。