сохраните фоновый div фиксированным, позволяя другому div прокручивать его как наложение

Question

, поэтому у меня есть анимация svg morph с использованием аниме. js и scrollmonitor в качестве фонового div, в то время как другой 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;
}

Answer 1

<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