移动与背景调整大小的元素

Question

我目前正在构建单页滚动网站。

在第二页上，我使用的是带有background-size：cover属性的背景。基本上我想要一个元素坐在背景上但是在调整大小时与背景相对应移动，即使这意味着元素移出视口。

这可能吗？

到目前为止我尝试过：

.background {
width:100%; 
height:100vh; 
margin:0;
background-image: url('Studio.jpg');
background-repeat: no-repeat;
background-size: cover;
background-position: 80% 0%;
overflow: hidden;
position: relative;
z-index: 1;
}

#image {
height: 100%;
width:100%;
background-image: url('lamp.png');
background-repeat: no-repeat;
background-size: auto;
position: absolute;
}

我已经嘲笑了一个图表，以便更好地解释我想要实现的目标：

第一个图显示了布局在全尺寸视口中的外观。 第二个图表显示了在调整视口大小时我希望布局的外观...因此图像元素相对于背景移动到视图端口之外。

Link to first diagram

Link to second diagram

Answer 1

听起来像是视差滚动或位置：固定在你的元素上。