Как избежать изменения позиции scroll в документе после установки #hash

При установке значения hash в url окна, к примеру так: window.location.hash = ‘#something’; браузер прокрутит документ до позиции элемента вида <a name=’something’></a>. Иногда такое поведение является не желательным.

После изменения позиции видимой части документа, нужный вам объект может быть скрыт, к примеру контейнером с fixed позиционированием. Это часто бывает, когда дизайн предусматривает наличие «плавающих» элементов вроде навигации, корзины и т.п.

Решение состоит в том, чтобы использовать метод history.replaceState(), он не инициирует перемотку к контейнеру. И дополнительно (если требуется) можно добавить плавный скролл с позицией не точно на контейнер, а со смещением, учитывающим особенности вашего шаблона.

В примере используется jQuery.

Мало букафф? Читайте есчо !

Вычисление N точек на арке

Июнь 10, 2025 г.

У нас есть окружность, заданная точкой её центра и радиусом. Еще у нас есть две точки, принадлежащие этой окружности - A и B, отсекая на окружности арку. ...

Читать

Создание контейнера DIV средствами чистого js

Август 5, 2018 г.

Иногда я возвращаюсь к практикам без использования jQuery, работая с DOM на чистом js. В таком контексте его называют vanila js. Давайте рассмотрим пример создания DIV контейнера, определения его свойств, пользуясь только javascript без библиотек-оберток. ...

Читать

Вставка html entites в текстовые ноды

Апрель 5, 2025 г.

Делюсь еще одним лайфхаков, как в плагине CKE5 вставить htmlentity. При вставке текста в модель, CKEditor будет преобразовывать html символы вроде '&' и '>'. Но что делать, если нужно вставить символ в виде html кода? Рассмотрим следующий ...

Читать

CKE5 функция создания контейнера-обертки в модели

Март 20, 2025 г.

Делюсь примером кода, для создания обертки в модели экосистемы CKEditor 5. Здесь есть несколько нюансов. Во-первых, нужно проверить, являются ли оборачиваемые элементы валидными по отношению к обертке, в которую мы их помещаем. У CKE элементов ...

Читать
 

Комментарии к «Как избежать изменения позиции scroll в документе после установки #hash»

Понравилась статья? Есть вопросы? - пишите в комментариях.



Комментарий: