Плавная прокрутка

Улучшайте свой сайт с хорошим эффектом, замедляет прокрутку при прыжках в другой части вашей страницы.

Использование

Постепенное снижение скорости при переходе от одной части страницы к другой, например, с к-топ-скроллер, просто добавьте data-uk-smooth-scroll атрибут к <a> элемент, что ссылки на ID раздела, который вы хотите створ.

Пример

В нашем примере мы используем Заголовок Smooth scroll как мишень.

Идите Вверх! Иди Вниз!

Разметки

<a href="#my-id" class="uk-button" data-uk-smooth-scroll>...</a>

Смещение

Смещение-параметр добавляет заданное расстояние до цели при расчете положения прокрутки. Смещение передается через Data-атрибут. Значение может быть как положительным, чтобы остановить прокрутку до цели или отрицательное остановить прокрутку после того, как цель.

Данные атрибут Описание
data-uk-smooth-scroll="{offset: 90}" Добавляет смещение, что не остановятся перед 90px в створ.
data-uk-smooth-scroll="{offset: -90}" Добавляет смещение, что не остановятся 90px в после цели.

Пример

По этой ссылке прокрутка сайта в Заголовок "плавная прокрутка" со смещением 90px.

По этой ссылке прокрутка сайта в Заголовок "плавная прокрутка" со смещением -90px.

Разметки

<a href="#my-id" data-uk-smooth-scroll="{offset: 90}">...</a>

<a href="#my-id" data-uk-smooth-scroll="{offset: -90}">...</a>