Прокрутить HTML документ к заданной позиции

Рассмотрим как программно установить позицию скролла документа ровно в начале нужного вам HTML контейнера.

Чтобы сделать переход плавно, можно использовать функцию jQuery().animate().

Суть процесса такова — вычисляем вертикальную позицию требуемого контейнера и задаём анимацию параметра scrollTop тега html или body.

Для конкретики пусть требуемый контейнер имеет id = myContainer.

Тогда js код, перематывающий документ к его началу, примет следующий вид:

Время анимации в данном примере 1/4 секунды. Возможно, время следует вычислять, исходя из расстояния, на которое требуется пролистать документ. Можете поэкспериментировать самостоятельно.

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

Виджетик для сравнения двух картинок

Ноябрь 1, 2015 г.

Этот виджет может найти применение для сайта дизайнера или фотографа, которые занимаются реставрацией или обработкой изображений. Наверное, приложений ...

Читать

Анимация смены картинок с помощью jquery

Декабрь 26, 2012 г.

Ещё одна типовая задача, для которой найдено приличное решение. Типично суть задачи состоит в следующем. Есть набор изображений, которые демонстрируются поочередно в некотором контейнере. Ставится задача по анимации периодической смены этих картинок средствами ...

Читать

Как убрать фокус, используя jQuery?

Сентябрь 22, 2016 г.

Не так принципиально, какой библиотекой мы воспользуемся, когда будем убирать фокус, я привык использовать jQuery. Потому речь пойдет в контексте этой библиотеки. Сложностей с тем как снять фокус с элемента традиционно больше, чем с тем, как его ...

Читать

Анимация ожидания загрузки/обновления, используя CSS3

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

Одна из типичных задач для улучшения пользовательского интерфейса на сайтах - это визуализация ожидания загрузки/обновления страницы. Наиболее частый случай ...

Читать
 

Комментарии к «Прокрутить HTML документ к заданной позиции»

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



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