Предотвратить прокрутку браузера в истории HTML5 popstate

Можно ли предотвратить стандартное поведение прокрутки документа при возникновении события popstate?

На нашем сайте используется анимированная прокрутка jQuery и History.js, и изменения состояния должны прокручивать пользователя в разные области страницы, будь то с помощью pushstate или popstate.Проблема в том, что браузер автоматически восстанавливает позицию прокрутки предыдущего состояния, когда происходит событие popstate.

Я пробовал использовать элемент контейнера, равный 100% ширины и высоты документа, и прокручивать содержимое внутри этого контейнера. Проблема с тем, что я обнаружил, заключается в том, что это не так гладко, как прокрутка документа; особенно при использовании большого количества css3, таких как тени и градиенты.

Я также пытался сохранить позицию прокрутки документа во время прокрутки, инициированной пользователем, и восстановить ее после того, как браузер прокрутит страницу (в popstate). Это отлично работает в Firefox 12, но в Chrome 19 наблюдается мерцание из-за прокрутки и восстановления страницы. Я предполагаю, что это связано с задержкой между прокруткой и запуском события прокрутки (где позиция прокрутки восстанавливается).

Firefox прокручивает страницу (и запускает событие прокрутки) до того, как сработает состояние всплывающего окна, а Chrome сначала запускает состояние всплывающего окна, а затем прокручивает документ.

Все сайты, которые я видел, которые используют API истории, либо используют решение, подобное приведенным выше, либо просто игнорируют изменение положения прокрутки, когда пользователь перемещается назад/вперед (например, GitHub).

Можно ли вообще предотвратить прокрутку документа при событиях popstate?

78
задан Brian Tompsett - 汤莱恩 6 September 2019 в 14:38
поделиться