20 лучших CSS анимаций на CodeCanyon

Russian (Pусский) translation by Yuri Yuriev (you can also view the original English article)

В интернет-истории было время, когда для добавления эффекта анимации, кроме GIF, нельзя было обойтись без Flash. Сегодня мы находим, что Flash отмер и такие вещи, как CSS3 и HTML5 привносят в Интернет фантастические анимации и эффекты.

Если для вашего сайта или веб-проекта требуются блестящие CSS animations, вот список из 20 лучших анимаций CSS на CodeCanyon:

1. Aero - CSS3 Hover Effects

Добавьте hover-эффекты затенённого стекла с помощью Aero - CSS3 Hover Effects.

Он полностью отзывчив и прост в использовании, вы найдёте:

замену цветов и переключение с круга на квадрат
совместимость с браузерами, даже с Microsoft Edge
совместим с SASS
настройка CzS
и другое!

Благодаря 10 эффектам, включенным в релиз и появлению большего количества эффектов, Aero - CSS3 Hover Effects - приятный набор анимаций CSS с эффектом наведения.

2. MegaHover Mouse Over Effects

MegaHover Mouse Over Effects предлагает мощную партию hover-эффектов CSS3, совместимых с Bootstrap 3.

Он имеет:

иконки Font Awesome
полную совместимость с браузерами
отзывчивость
и другое

С лёгкостью вставляйте и моделируйте MegaHover Mouse Over Effects.

3. Animatia - CSS Image Hover Effects

Лёгкий, быстрый в установке и настройках? Таков Animatia - CSS Image Hover Effects.

Пакет CSS включает:

более 115 hover-эффектов с настройками
лёгкие в работе и отзывчивые файлы
чистые CSS3 и иконки Font Awesome
и другое

Пользуйтесь Animatia - CSS Image Hover Effects для стилей кнопок, эффектов наложения, титров и других анимаций CSS.

4. Hover Effects Framework

Hover Effects Framework - блестящее решение CSS анимации.

Чистый код, отзывчивость и:

IcoMoon Ultimate Font
4 формы и 5 цветов
50+ анимаций
и другое

В Hover Effects Framework чистый код, и, самое главное, он содержит множество примеров для начала работы с красивыми анимациями CSS.

5. Collection of Preloaders

После Collection of Preloaders вам не понадобится никакая другая коллекция.

Вы получите:

документацию для простой настройки
лёгкий и гибкий набор анимаций CSS3
27 уникальных preloaders

Полностью мобильная, Collection of Preloaders - отличное дополнение к набору CSS3.

6. CSS3 Image Hover Effects

Если вы видели одну анимацию CSS с эффектом hover, других вам не надо, так?

Не совсем.

CSS3 Image Hover Effects обладает некоторыми исключительно приятными эффектами.

Включая:

22 разных CSS3 hover-эффекта
потрясающий и отзывчивый
чистый код CSS3
и другое

Проверьте совместимый с Bootstrap CSS3 Image Hover Effects.

7. Image Hover CSS Library

Image Hover CSS Library - это масштабируемая, лёгкая библиотека анимаций CSS, которую стоит посмотреть.

Это классная коллекция из 58 hover эффектов, уменьшенная до 25 КБ.

работает с любым контентом
особые hover эффекты
легко использовать
и другое

Трудно выделиться среди CSS-анимаций изображений, но Image Hover CSS Library сделала это.

8. SVG Logo Scroll Animation | CSS3 and Javascript

Приятно отвлечься от обычных CSS-анимаций и взглянуть на что-то вроде SVG Logo Scroll Animation | CSS3 and Javascript.

Менее, чем в 4k вместилось несколько красивых страниц SVG-анимаций.

Украшайте страницы анимациями с SVG Logo Scroll Animation | CSS3 and Javascript.

9. Viavi CSS3 Scroll Effects

Viavi CSS3 Scroll Effects - это действительно красивое CSS3-scroll анимационное решение.

Его некоторые опции:

16 CSS 3 эффектов прокрутки
простая реализация
отзывчивость
и другое

С сеткой и сенсорной панелью, Viavi CSS3 Scroll Effects не только хорошо смотрится, но и сделан отлично.

10. CSS3 Spinners & Loaders

Нужны загрузчики без gifs?

Нет проблем. Есть CSS3 Spinners & Loaders.

более 25 вариантов
простота настройки
легко расширяется

CSS3 Spinners & Loaders хорошо документирован и являются полным решением для CSS для spinners и загрузчиков.

11. Midix - CSS3 Animation Effects without jQuery

С чистым CSS3, эффекты Midix - CSS3 Animation Effects without jQuery крепкий набор из 16 анимаций CSS.

Вы получите:

скорость анимации
паузы анимации
цвета иконок

Вместе с Midix - CSS3 Animation Effects without jQuery вы получите не только CSS анимации, но и бесплатные обновления и дружескую поддержку.

12. CSS3 Hover Effects

CSS3 Hover Effects - ещё одна отличная опция.

Вы можете легко изменить:

цвет
размеры границ
круг на квадрат
пробелы между блоками текста

Благодаря 479 retina-значкам и 20 различным эффектам, CSS3 Hover Effects - отличный ресурс для использования.

13. VSPreloader - Ultimate CSS Animated Preloaders

Среди других подобных, VSPreloader - Ultimate CSS Animated Preloaders - одно из самых уникальных и привлекательных решений.

Опции:

60 помощников
40 представлений
30 анимаций
палитра цветов

это невероятно ярко и уникально.

Присмотритесь к VSPreloader - Ultimate CSS Animated Preloaders. Думаю, вы будете впечатлены.

14. Heed - Pure CSS3 Animation Effects

В Heed - Pure CSS3 Animation Effects есть всё необходимое для CSS анимаций.

Его легко установить, отредактировать и настроить с помощью SCSS (файл внутри).

20 вариантов дизайна цвета материала
Font Awesome иконки
15 эффектов
и другое

Heed - Pure CSS3 Animation Effects совместим с retina, имеет поддержку и бесплатные обновления.

15. Ayan - CSS3 Link Hover Effects

Когда большинство анимаций CSS сосредоточено на изображениях и эффектах страницы, Ayan - CSS3 Link Hover Effects продвигает впечатляющую линейку hover-эффектов.