javascript - 保持背景 div 固定,同时允许另一个 div 作为覆盖层在其上滚动

标签 javascript html css

所以我有一个使用anime.js和scrollmonitor作为背景div的svg变形动画,而另一个具有页面内容的div是在固定背景div上滚动。 但它没有按预期工作。背景 div 不会像背景一样保持固定,而是与覆盖 div 一起向下滚动。

请帮忙解决这个问题。我对自己错过了什么一无所知。 这是网站链接

https://esselion.com/passapp/#/

.morph-wrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    z-index: 1000;
}

.content-landing-wrap{
    position: relative;
    z-index: 1100;
    overflow-y: auto;
}

最佳答案

<div class="morph-wrap">相对于其父容器是固定的。如果你搬家<div class="morph-wrap"> <div id="main"> 之外,当您滚动时它将保持固定。

<div id="content-scroll">
  <div class="morph-wrap"></div>
  <div id="main"></div>
</div>

下次请包含您的 HTML,这样我们就不必检查您的网站。这将帮助我们帮助您。 :D

关于javascript - 保持背景 div 固定,同时允许另一个 div 作为覆盖层在其上滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60309011/

相关文章:

javascript - 即使用户导航到另一个页面,是否可以让 `XMLHttpRequest` 对象保持事件状态?

html表格间距和边距错误

css - 使用 png 创建方形空间动画

javascript - 如何将 CSS 参数链接到 javascript img?

javascript - drive rest api 的 File 对象中的 downloadUrl 属性是什么?

javascript - jQueryUI,窗口关闭时的函数

javascript - js.erb 不执行 javascript 但已处理 rails

javascript - 如何将选中的复选框数据附加到html <div> 标签中的列表顶部?

javascript - 如何显示连接到选择标签并点击按钮的图片

javascript - 如何在禁用 JavaScript 时显示不同的内容?