Топ 9 анимационни библиотеки през 2016 г.
Допреди 10 години разработчиците използваха Adobe Flash, за да добавят интерактивност към сайта. С бързото развитие на HTML5, CSS3 и безброй JS библиотеки, Flash вече отстъпи на заден план (за щастие?). 2015 беше богата на безплатни библиотеки за анимация и днес ще говоря за 9 библиотеки и ще се съсредоточа върху лекотата на използване, функциите и общата популярност.
Animate.css
Animate.css е една от най-лесните за използване CSS библиотеки за анимация. Добавянето на библиотека е толкова лесно, колкото добавянето на обикновен CSS клас към HTML елемент. Можете също да използвате jQuery, за да задействате анимации за конкретни събития.
Създател: Даниел Идън
Практически курс за оформление на адаптивен уебсайт от нулата!
Вземете курс и научете как да подреждате модерни уебсайтове в HTML5 и CSS3
Дата на издаване: 2013
Текуща версия: 3.4.0
Популярност: 25 000+ звезди в GitHub
Описание: „Библиотека за анимация на CSS в различни браузъри. Много лесен за използване. "
Размер на библиотеката: 55.2 Kb
Animate.css е една от най-популярните и широко използвани CSS библиотеки за анимация. В допълнение, умалената версия е достатъчно малка, за да включи библиотеката в мобилни версии на сайтове. Лично аз мисля, че това е една от най-добрите анимационни библиотеки, които съм срещал. Силно препоръчвам да го използвате в следващия си проект.
Bounce.js е набор от инструменти и JS библиотека, който се фокусира върху уникално анимиране на гъвкави обекти с помощта на CSS.
Дата на издаване: 2014
Текуща версия: 0.8.2
Популярност: 3500+ звезди в GitHub
Описание: "Създайте незабавно красиви CSS3 анимации."
Размер на библиотеката: 16 Kb
Bounce.js е елегантна анимационна библиотека, която се предлага с десет предварително запазени шаблона, за да поддържа размера на файла малък. Подобно на animate.css, анимацията изглежда гладка и безупречна. Ако не се нуждаете от изчерпателен списък с типове анимация и ако търсите лека библиотека, тогава този екземпляр може да бъде поставен във вашата касичка.
Магически анимации
Magic Animations е една от най-впечатляващите библиотеки там. Тя има огромен набор от различни анимации в арсенала си, много от които са уникални. Както е случаят с Animate.css, за да включите библиотеката, просто трябва да включите CSS файла. Също така е възможно да се използва анимация чрез jQuery. Проектът има страхотна демонстрация.
Дата на издаване: 2014
Текуща версия: 1.1.0
Популярност: 3400+ звезди в GitHub
Описание: "CSS3 анимация със специални ефекти."
Размер на библиотеката: 36,5 KB
Магическите анимации са доста малки в сравнение с animate.css и са най-известни със своите собствени анимации като магически, глупави и бомбени ефекти. Ако търсите нещо необичайно, определено бих препоръчал да използвате тази библиотека в следващия си проект. Няма да си разочарован.
DynCSS е библиотека, която върви добре с паралакс ефект. За да разберете напълно възможностите на библиотеката, разгледайте демонстрацията.
Създател: Виторио Закария
Дата на издаване: 2014
Текуща версия: 0.8.1
Популярност: 190+ звезди в GitHub
Описание: „Оживете сайта си с динамична CSS анимация.“
DynCSS е проста библиотека, която може да стане много популярна в не толкова далечното бъдеще. В момента това е доста нов проект, както можете да видите от звездите на GitHub. Една от характеристиките на тази библиотека е ефектът от въртящите се елементи едновременно с превъртането. Vittorio демонстрира прекрасно този ефект на началната страница на DynCSS (идеален за ефект на паралакс).