​​ANIMSITION — простой jQuery плагин для создания анимированных переходов между страницами. Большой и разнообразный набор эффектов (всего 58 штук).

Демо | GitHub

#jquery #animation

​​Tuesday — библиотека css-анимаций. Главным достоинством этой библиотеки является простота, анимации очень приятные и не отвлекают от контента.

Демо | GitHub

#css #animation

Качественная и уместная анимация веб-страниц радует глаз и помогает в работе. Это – одна из основ веб-дизайна наших дней.

Когда анимация способна улучшить впечатления пользователя от работы со страницами? Что именно стоит «оживить» для того, чтобы взаимодействие с ресурсом стало бы более удобным, понятным, увлекательным?

Веб-анимация: где, зачем и почему

#article #animation

​​Magic — это невероятные кросс-браузерные анимации, которые можно использовать в дизайн-проектах. Еще у них есть версия для React.

Демо | GitHub

#css #animation

​​Shuffle Letters — это jQuery плагин, который создает интересный эффект вывода текста. Буквы выводятся рандомно, одна за другой.

Демо | GitHub

#text #animation #jquery

​​animate-plus.js — это jQuery плагин, который создает анимации на странице. Для создания анимаций не нужен JavaScript, все работает через классы и data-атрибуты.

Демо | GitHub

#js #animation

​​Несколько красивых эффектов подчеркивания при наведении на ссылки

CodePen

#css #animation

​​Glorious Demo — это JavaScript библиотека, которая берет ваш код создает красивые анимации печатая его в терминале. Библиотеку легко кастомизировать и очень просто добавить на ваш сайт.

Демо | GitHub

#js #animation

​​Three Dots — это CSS библиотека для создания интересных анимаций загрузки с тремя точками. Есть большой выбор готовых анимаций и возможность кастомизации (скорость, цвет, тип анимации и т.д.). Этот проект не только улучшит ваши навыки, но и расширит воображение.

Демо | GitHub

#css #animation #loading

Scene.js — это JavaScript библиотека анимаций с множеством крутых функций. Её можно использовать с помощью JS и CSS, она поддерживает SVG и имеет много классных пресетов прямо из коробки.

Демо | GitHub

#js #animation

Разработка анимированного Favicon

Это — первое, что ищут взглядом, когда переключаются между вкладками браузера. Пространство на экране, которое занимает ярлык вкладки веб-страницы — это гораздо более ценный ресурс, чем многие думают.

Читать статью

#article #animation #favicon

Granim.js — это небольшая JavaScript-библиотека, помогающая украсить интерфейс интерактивными орнаментами, основанными на градиентах. Это может быть стандартный круговой градиент, или динамический градиент, применяемый к фону картинки, или движущиеся градиенты в сочетании с масками.

Демо | GitHub

#js #library #animation

🛠 Iconate.js — это библиотека, которая добавляет красивые анимации к иконкам на вашем сайте. Работает с разными типами шрифтов.

🔍 Демо | 📂 GitHub

#js #animation #icons

🛠 Elevator.js — простая кнопка «Наверх», которая имитирует поведение настоящего лифта, и даже воспроизводит соответствующее звуковое сопровождение.

🔍 Демо | 📂 GitHub

#js #animation

🛠 Bounce.JS — это инструмент и библиотека JS для создания красивых анимаций ключевых кадров на основе CSS3.

Bounce.JS позволяет генерировать статические ключевые кадры, которые можно использовать без какого-либо дополнительного JavaScript, но если вы хотите, чтобы ваше приложение генерировало их на лету, вы можете использовать библиотеку Bounce.js. Для этого, Вы будете использовать scale, rotate, translate и skew методы для создания анимации.

🔍 Демо | 📂 GitHub

#animation #js