Javascript Div元素的作用类似于背景

我怎样才能使

元素像这个网站的介绍一样充当背景呢

这是我的密码笔

$（文档）.ready（函数（）{
$（窗口）.bind（'scroll'，function（）{
var navHeight=$（窗口）.height（）-70；
如果（$（窗口）.scrollTop（）>navHeight）{
$（'nav'）.addClass（'fixed'）；
}
否则{
$（'nav'）.removeClass（'fixed'）；
}
});
});
#div1，#div2{
高度：100vh；
}
#div1{背景色：青色}
#div2{背景色：浅灰色}
导航{
位置：绝对位置；
底部：0；
宽度：100%；
背景：绿色；
填充：2px0；
z指数：1；
}
.固定{
位置：固定；
排名：0；
高度：70像素；
z指数：1；
}
部分{
高度：100vh；
}
/*屏幕设置*/
#屏幕1{
背景#43b29d；
}
#屏幕1 p{
填充顶部：200px；
}
#屏幕2{
背景：efc94d；
}

左侧部分
右侧部分
在此导航
我修改了你的代码。
希望这就是你想要的

我在div1和Div2周围做了一个包装，它是固定的，可以改变大小

包装纸

<div id="intro-wrapper">
  <div id="div1" class="col-md-3">a</div>
  <div id="div2" class="col-md-9">b</div>
</div>

导航位置

nav {
  position: absolute;
  top: calc(100vh - 70px);
  width: 100%;
  background: Green;
  padding:2px 0;
  z-index:1;
  height:70px;
}

您希望将哪个设置为背景？？你能再解释一下吗？#div1和#div2但是如果我在#intro包装中创建一个标记，它将不可点击。我已经更新了代码笔。请检查更改：现在它完全可以点击了
nav {
  position: absolute;
  top: calc(100vh - 70px);
  width: 100%;
  background: Green;
  padding:2px 0;
  z-index:1;
  height:70px;
}