Бывала ли у вас ситуация, когда вы просматриваете контент сайта и в какой-то момент из-за подгрузки дополнительного контента происходит скачок скролла страницы и вам необходимо было вернуться обратно. Либо же обратная ситуация - вы читаете текст и замечаете, что позиция скролла меняется из-за подгрузки дополнительного контента, однако фокус страницы на вашем тексте не меняется. За это поведение отвечает новый реализованный в браузере метод - привязка скролла.
В современных браузерах привязка скролла включена по умолчанию, поэтому, скорее всего, скачок фокуса страницы не изменится. Однако, если у вас более старая версия браузера или вам умышленно необходимо отключить привязку скролла, на помощь может прийти CSS свойство overflow-anchor.
Свойство может иметь всего два значения:
- auto - значение по умолчанию; привязка скролла включена.
- none - привязка скролла отключена.
Для отключения привязки скролла внутри определенного блока, свойство следует указать самому контейнеру:
.container {
overflow-anchor: none;
}Для отключения привязки скролла всей страницы, свойство указывается внутри body:
body {
overflow-anchor: none;
}
Комментарии (0)