Magic Animations библиотека для добавления анимации на сайт — PROG-TIME

Magic Animations библиотека для добавления анимации на сайт

01.07.2020
Содержание:

Давайте вновь рассмотрим готовую CSS анимацию. Сегодня мы рассмотрим библиотеку Magic Animatons. Здесь мы можете просто добавить красивую анимацию в два клика.

Ссылка на библиотеку Magic Animations — https://www.minimamente.com/project/magic/

На странице библиотеки вы можете найти примеры анимации, которые доступны в данной библиотеке.

Для того чтобы добавить анимацию на свой сайт вам нужно скачать данную библиотеку и подключить ее к своему сайту. Там только CSS файл.

<link rel="stylesheet" href="magic-master/dist/magic.css">

После этого вам нужно прописать класс соответствующий вашей анимации. Имя класса можно увидеть на сайте, для этого нужно нажать на кнопку которая появляется при нажатие на название анимации.

После добавления класса анимация уже срабатывает, но для лучшего эффекта вы можете прописать скрипт и указать в нем событие после которого должна срабатывать анимация (например наведение или нажатие на элемент).

На GitHub странице вы можете найти примеры использования скрипов для активации анимации. Здесь есть скрипты на jQuery и нативном JavaScript.