Жидкая анимация в веб-дизайне в последнее время очень популярна. Итак, в этом посте мы собрали список из 10 библиотек эффектов анимации Javascript Liquid, чтобы создать потрясающую анимацию для вашего следующего проекта.

glfx.js

Библиотека графических эффектов для JavaScript с использованием WebGL. Настройте фотографии в своем браузере в режиме реального времени с помощью glfx.js, библиотеки графических эффектов на основе WebGL. Он использует вашу видеокарту для эффектов изображения, которые невозможно применить в режиме реального времени только с помощью JavaScript.

glfx.js

Blotter.js

JavaScript API для рисования нетрадиционных текстовых эффектов в сети. Blotter предоставляет простой интерфейс для создания и управления текстовыми эффектами, использующими шейдеры GLSL, не требуя от разработчика написания GLSL. Blotter имеет растущую библиотеку настраиваемых эффектов, а также предоставляет студентам или опытным программистам GLSL способы быстрой загрузки новых.

Blotter.js

Paper.js

Paper.js - это векторный графический фреймворк для JavaScript, который позволяет пользователю создавать формы, рисунки и анимацию. Используя векторную геометрию, формы легко создавать и рисовать. Математические операции над векторами также упрощаются; позволяя пользователям вычитать, складывать, умножать и делить векторы с помощью одной строки кода.

Paper.js

LegitRipple.js

Легкий, основанный на CSS плагин jQuery для создания волновых эффектов в material дизайне.

LegitRipple

jQuery Ripples

С помощью WebGL добавьте слой воды в ваши элементы HTML, который будет колебаться при взаимодействии с курсором!

jQuery Ripples

Rippler

Эффект, который распространяется как волна касания или щелчка. Вы также можете использовать кнопки на начальной загрузке.

Rippler

Simplex-noise

Simplex-noise.js - это быстрая реализация симплексного шума в Javascript. Это работает в браузере и на nodejs.

Simplex-noise

MOjs

Это библиотека движущейся графики javascript, которая является быстрой, готовой к работе с сетчаткой, модульной и с открытым исходным кодом. По сравнению с другими библиотеками, он имеет другой синтаксис и подход к структуре анимации кода. Декларативный API предоставляет вам полный контроль над анимацией, делая ее легко настраиваемой.

MOjs

Granim.js

Создавайте плавные и интерактивные градиентные анимации с помощью этой небольшой библиотеки JavaScript.

Granim.js

Rippleria

Легкий, но настраиваемый плагин jQuery для реализации вдохновленных дизайном материалов эффектов пульсации щелчка / касания с использованием CSS3-анимации.

Rippleria