Анимация при прокрутке (скролле) страницы на HTML CSS и JavaScript

Анимация при прокрутке (скролле) страницы очень полезно для повышения удобства пользования вашим сайтом. К тому же это очень красиво и современно. В этом видео я пошагово покажу как анимировать элементы при прокрутке страницы без тяжелых библиотек используя HTML CSS и JavaScript.

Содержание:
00:00 - Введение, подготовка к работе
01:21 - Настройка анимации в CSS
03:38 - Пишем JavaScript код
13:46 - Примеры применения анимаций при скролле
22:22 - Итоговый результат

👋 Меня зовут Женя Андриканич, я IT - специалист, занимаюсь разработкой сайтов. На этом канале, я регулярно и в максимально доступном формате буду делиться с тобой своим опытом, наработками, секретами и лайфхаками!

🤟 Живи, а работай в свободное время! ©

[DenisZagvozdin]

Спасибо тебе за бесплатные и невероятно качественные уроки! Ты - один из немногих, кто показывает всё с нуля и на чистом JS. Не всегда хочется пользоваться сторонними библиотеками и всякими jquery. Спасибо и за это! Продолжай делать контент и помни: живи, а делай годный контент в свободное время

[boy_ron]

Я:Только вчера задумался над такой анимацией на сайте.
Жека: вот держи!

[george_m]

Наконец-то!!! Всё время хотел понять как это работает, да всё руки не доходили.Спасибо большое!

[ПавелПискарь-йъ]

Буквально каждое видео - невероятно годный контент. Не канал, а сокровище. Очень рад, что встретил его. Спасибо большое и удачи!

[jasonborn]

Сморю этого человека уже почти год! Нету слов просто,
низкий поклон! спасибо!

[shukonfadah]

все ваши виде это лучшее что можно найти на русскоязычном сегменте! вы самый лучший! Я поддерживаю вас во всём! желаю мира и спокойствия вашей стране и семье!!!

[moi-nick-zanyat]

просто огромное количество информации в одном ролике, обязательно навешаю ко всему)

[bio.Minecraft]

вообще не разбираюсь в Js, по рекомендации зашёл. Интересно стало, и тут пожалуйста, все очень понятно. Немного посидел, переписал, все сделанное, буду учить дальше). Спасибо большое за информацию!

[demendarkness]

Лучший! Спасибо! Только твои туторы адекватно работают с первого раза!

[xarex]

Один из самых крутых каналов, очень много полезного. Спасибо большое!

[АсяА-чя]

Спасибо вам огромное, ваши видео кардинально меняют представление о, казалось бы, таких сложных моментах. Здорово, что вам пришла в голову снимать подобные ролики.

[СергейСтепаненко-ий]

Спасибо за внятный и понятный урок. Жаль, так мало людей Вам поставили одобрительную оценку из тех, кто просмотрел видео (

[eduardsakulin]

Жека, человечище с большой буквы. Разложил все по полкам. Очень годно. Спасибо ОГРОМНОЕ!!

[abolnikov]

Только наткнулся на это видео, видать колокольчик забыл. Но уже заинтриговало. Представляю как мои заготовки оживут после просмотра. Спасибо за такие вот видео. Очень полезно и помогает в развитии.

[zmeygorynych]

Сложный js простыми словами от Жеки) Спасибо, огромный вклад в наше образование)

[FrQ-hl]

Рома дуже дякую тобі за урок, черпаю спокій та рівновагу, дуже цінні знання. Мирного неба

[elkhanhamet]

Красавчик Женя!!! Я так долго искал урок по этой теме, и вы великолепно все разъяснили показали. Спасибо вам огромное.

[egoryurchenko]

Как раз то что нужно мне сейчас для заказа) Спасибо! лайк

[ВиталийКабаков-фэ]

Ура! Злободневный вопрос! Сейчас буду смотреть! Лайк поставил сразу 😜

[anutasolnechnaya]

Как мне нравится твой канал!!! Все понятно и очень нравится твой стиль преподавания!!!