2017-02-20 2 views
0

У меня есть код, использующий метод jQuery scrollTop(0), который не работает корректно в Chrome (версия 56.0.2924.87).jQuery прокрутите вверх до замораживания, если вызвана средняя прокрутка

Мой код задает 2 второй тайм-аут, который делает следующее:

  • Scrolls в верхней части экрана.
  • Скрывает div, который имеет ширину и высоту 100% и просит пользователя выполнить какое-либо действие.
  • Добавляет класс в тег html, который устанавливает overflow: hidden.
  • Как только пользователи завершат действие, он удалит класс и скроет div, чтобы продолжить прокрутку.

Это работает с релейлистами в Firefox.

В Chrome, если 2-секундный тайм-аут выполняется, когда пользователь не прокрутки, то он работает так, как ожидалось. Однако, если 2-секундный тайм-аут вызывается, когда пользователь находится в середине прокрутки, он, кажется, замерзает.

Я создал this Plunker, содержащий весь код. Проблема не возникает, если вы тестируете внутри встроенного демонстрационного окна, вам нужно нажать «Предварительный просмотр» в отдельном окне (синяя кнопка вверху справа в демо-версии кода).

В моем демо, это то, что произойдет, если тайм-аут работает в то время как я не активно прокрутки:

enter image description here

И это то, что произойдет, если тайм-аут выполняется в то время как я прокрутки вниз (mid-scroll): enter image description here

Как я могу сделать эту работу надежно на Chrome, даже если пользователь в данный момент прокручивает страницу?

ответ

1

Почему вы не видите div при отображении. Когда событие вызывается посреди прокрутки скрытой полосы прокрутки и верхней части верхней части страницы, но окно просмотра не находится в верхнем положении. Если вы установите свойство позиции CSS CSS, оно будет работать, css position. фиксированное значение свойства position относительно окна просмотра.

Таким образом, проблема не в вашем коде jquery.

code here 

plunker

И проверить это:

  • Scrolls в верхней части экрана.

  • Как только пользователи завершат действие, он удалит класс и скроет div, чтобы продолжить прокрутку.

Я думаю, что было бы лучше, если они смогут продолжить работу на прежнем месте.

0

Что делать, если вы добавите stop(). перед .scrollTop (0)?

$('html,body,document').stop().scrollTop(0); 

Я не эксперт, но возможно, стоит сделать снимок.

Надеюсь, это поможет.