javascript - 如何将元素设置为固定全屏

Question

为了清楚起见，我想要一个全屏标题。在动态滚动(单个或多个滚动)上，整个标题应该随着屏幕向下滚动而向上滚动消失。反之亦然，如果用户从内容顶部滚动更多，则标题应向下滚动到全屏。

我可以使用 css 来做到这一点吗？我在 AWWWARDS.com 提交的网站上看到这种设计更常用

Answer 1

简短的回答:没有。如果我理解得很好，你想要一个视差效果，其中一个滚动将滚动到第一个 anchor 。

但是对于全屏标题使用这个:

<div class="fullscreen">
    <img src="test.jpg">
</div>

<style>
.fullscreen{
width:100%;
height:100vh;
}

.fullscreen img{
min-width:100%;
min-height:100%;
height:100%;
width:100%;
object-fit:cover;
}
</style>