3.15 Плавный скролл при переходе по якорям


На сайте есть множество интерактивных элементов и все они должны работать плавно, чтобы пользователь понимал, что происходит. Например переход по элементам меню должен перемещать к выбранному пункту, но это должно быть не резко. В этом уроке вы научитесь переопределять стандартное поведение ссылок и делать переход по ним плавным.

Дополнительные материалы: developer.mozilla.org/ru/docs/Web/API/Event/preventDefault
learn.javascript.ru/coordinates-document

Ссылка на макет: www.figma.com/file/lFqXrgfJRmKsiF9wl9omlI/Portfolio
Чат в телеграм — t.me/joinchat/CJJ7_BROjQewexDwnr9Rpg

0:00 — Введение
0:28 — Получаем ссылки-якоря
1:10 — Добавляем прослушивание события
2:10 — Сбрасываем стандартное поведение
2:25 — Получаем ссылку на элемент

2:59 — Получаем место элемента по ссылке
3:34 — Добавляем переход к элементу
3:59 — Чиним скролл
4:30 — Выводы

Сайт компании — napoleonit.ru/

Записаться на другие курсы — napoleonit.ru/schools.html
Мы ВКонтакте — vk.com/napoleonit_school
Instagram — instagram.com/napoleonit_school
Детские курсы — junior.napoleonit.ru/

0 комментариев

Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.