Как делать супер пупер анимации на сайте без определенных знаний в JS

akeela · 23 апр 2021

Вступление
Допустим, вы веб-дизайнер, вы хотели бы, чтобы на вашем сайте были классные двигающиеся блоки. Но как же сделать? У вас же недостаточно знаний в JS. Тогда хочу вас обрадовать. Есть такой сайт - https://michalsnik.github.io/aos/, с помощью него можно создавать сия шедевры.
Вот так он выглядит:
Прокручивая сайт вы увидите множество анимаций, которые вы можете подключить к своим элементам.

Как это сделать?
Все очень просто. Идем в самый низ сайта:

Вставляем в <head> эти строчки кода:

Перед закрывающим тегом </body> вставляем эти строчки:

Если вы хотите подключить оффлайн, то там есть кнопка скачивания, затем распаковываете архив и смотрите строки подключения, вместо сайта вы указываете папку со своей библиотекой (все очень просто, разберетесь)

Вы успешно подключили библиотеку к сайту!

Что делать дальше?

Дальше вы идете и выбираете нужную вам анимацию и вставляете атрибут data-aos (выделено на рисунке ниже) после тега <div> (ну или еще на что-то, где вы бы хотели увидеть анимацию) на своем сайте.

Поздравляю! Вы успешно подключили данную анимацию!

ivNNN · 23 апр 2021

бля, прикольно

ska3o4nik · 23 апр 2021

топчик

Hikkori_inactive4114136 · 23 апр 2021

классно, но если собираешься работать и иметь стабильный доход, лучше самому изучить джс.

fork_to · 26 апр 2021

Баянище

Ищу курс Fullstack

Сливы на FrontEnd Developer

Где можно выучить js и react.js

Атрибуты noopener и noreferrer

Поделитесь вашим опытом в Scrum

Какие курсы по HTML можете посоветовать нубу ?

Помогите пожалуйста выбрать видео/курс слитый для того что бы начать изучать Frontend разработку

Курс CSS html JS

[Евгений Андриканич] [Фрилансер по жизни] Курс по верстке (2021)

Есть у кого сливы по HTML и CSS

React - Полный Курс по React и Redux [Udemy] [Bogdan Stashchuk]

Уимся верстать Урок: №1

Друзья, привет Залетаю во фронтенд разработку, need help

Подробный урок по "hello world" на js для начинающих

Помогите с сайтом

Ищу нормальный сайт/видео курс по React

[Skillbox] Профессия Frontend-разработчик (2019)

Сливы популярных платформ.

Решите задачу

Помогите с RMS

Задачи js

Подкиньте какие-то курсы по html/css

Поделитесь курсом если есть

Посоветуйте курс для начала во frontend разработке

[Udemy] [Исмаил Усеинов] 1080p FULL КУРС

[Сбер университет] Frontend-разработчик (2022)

Путь js

[Яндекс.Практикум] Python-разработчик плюс [Часть 2 из 14] (2021)

WEB-разработчик 2020 [Udemy] [Иван Петриченко]

Слив курса "Асинхронный онлайн‑курс Vue.js 3 Разработка клиентских приложений"

Как делать супер пупер анимации на сайте без определенных знаний в JS