Так что меня интересует привязка к прокрутке. Я попытался немного поиграть с ним, но ничего не вышло. Я пробовал в chrome и firefox, но оба безуспешны. вот мой код, пожалуйста, помогите.

* {
  margin: 0;
  padding: 0;
}

body {
  scroll-snap-type: y mandatory;
  overflow-y: scroll;
  scroll-snap-points-y: repeat(100vh);
}

header {
  height: 100vh;
  width: 100%;
  background: #ff0000;
  scroll-snap-align: start;
}

div {
  height: 100vh;
  width: 100%;
  background: blue;
  scroll-snap-align: start;
}

section {
  height: 100vh;
  width: 100%;
  background: yellow;
  scroll-snap-align: start;
}
<body>
  <header>
    <h1>
      Header
    </h1>
  </header>
  <div>
    <h1>
      Div
    </h1>
  </div>
  <section>
    <h1>
      Section
    </h1>
  </section>
</body>
0
UrTech Tips 20 Май 2021 в 09:37

1 ответ

Лучший ответ

Я бы попытался убедиться, что все элементы внутри привязки прокрутки одинаковы, т.е.

[много других div]
, в качестве альтернативы, попробуйте не использовать тело в качестве оболочки и посмотреть, поможет ли это.

Вот документ с лучшим объяснением

Изменить: я протестировал его, и размер оболочки должен быть того же размера, что и ее дочерние элементы, вы можете не обращать внимания на остальную часть того, что я сказал, но я все равно не предлагаю использовать тело в качестве оболочки в следующий раз.

1
Robyn 20 Май 2021 в 13:08