Всем привет! Как писал ранее, продолжаю постепенно создавать свое портфолио в виде сайта с проектами и параллельно на этом учусь web-разработке. И в один момент мне захотелось добавить немного динамики в графики, при этом, чтобы анимация запускалась только в момент докрутки пользователя до нужного элемента. В итоге наткнулся на чудесный скрипт WOW js. Да, запуск анимации при скролле можно настроить через ванильный JS (чуть позже напишу сам этот код) или же с помощью плагина ScrollMe jQuery, но я решил не усложнять себе жизнь и нашел прекрасный для моих нужд wow js...

Итак, сегодня мы научимся делать плавный скролл на jQuery. Демо на codepen Разметка Создаем 4 кнопки и 4 секции. <button>1</button> <button>2</button> <button>3</button> <button>4</button> <div>Секция 1</div> <div>Секция 2</div> <div>Секция 3</div> <div>Секция 4</div> Стили Создадим внутренние отступы — padding и установим серый фон для каждой второй секции для визуального разделения. .section {padding: 70px 0;}. section:nth-child(2n) {background-color: #eee;} Что получилось Интерактив В jQuery создаем событие клика на кнопку, предварительно проставив классы с префиксом js-...