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

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

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

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

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

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

Чтение GET параметров в JS

Октябрь 7, 2018 г.

Как прочитать GET параметры на стороне клиента из кода на javascript? Бывают ситуации, когда нужно что то сделать из JS в зависимости от переданных параметров ...

Читать

Копирование текста в буфер обмена на js

Март 12, 2024 г.

Есть устаревший способ, с которым можно ознакомиться здесь, а ниже мы рассмотрим рекомендуемый подход. Для работы с буфером обмена был внедрен Clipboard API. Он позволяет не только двунаправленно работать с буфером обмена, но также и обрабатывать ...

Читать

jQuery плагин для ввода диапазона значений

Февраль 22, 2017 г.

Подбирал плагин, реализующий компонент для выбора диапазона чисел. Перебрал не мало "добра", были и некоторые довольно свежие плагины, но остановил свой ...

Читать

Jquery перебор элементов

Октябрь 18, 2015 г.

С помощью селектора jQuery мы выбрали какие то элементы. Как теперь организовать их перебор в цикле? Есть пара вариантов. Используем функцию $.each(func) Разработчики не могли не заложить перебор по найденным элементам в библиотеку. Параметром должна ...

Читать
 

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

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



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