Chrome автоматически скролит вниз страницы
Chome — мой основной браузер и не так давно я столкнулся со странным поведением в этом браузере.
Введение
На главной странице моего блога имеется masonry сетка из 9 карточек и кнопка «Загрузить еще». По нажатию кнопки через ajax добавляется еще 9 карточек.
Странность заключается в том, что chrome после подгрузки карточек оставляет кнопку «Загрузить еще» на той же позиции экрана, что и до загрузки. На малых разрешениямх экрана (когда 9 карточек не влазят в экран) после подгрузки видно только 2–3 последние карточки и требуется скролить наверх, чтобы посмотреть остальные.
Сперва я перепроверил свой код, ошибок не нашёл. Проверил в ie и firefox, в них работает как надо: после загрузки карточек видно первые 2–3 (а не последние). Я подумал, что это баг хрома.
Но это не баг, это фича!
Оказалось, что это Scroll Anchoring — привязка экрана к положению прокрутки, чтобы предотвратить видимые скачки, когда допустим сверху страницы подгружаются картинки. Экспериментальная функция была представлена в Chrome 51 и включена по-умолчанию в Chrome 56.
Вместо тысячи слов
Без Scroll Anchoring:
С Scroll Anchoring:
Сделать как было раньше
Следует добавить CSS свойство к прокручиваемому контейнеру
overflow-anchor: none