Philter.js - бесплатная библиотека для изменения изображений с использованием фильтров CSS
Instagram широко известен как самая популярная фотосеть. Он обрабатывает более 52 миллионов фотографий в день, и многие из них включить фильтры которые изменяют образы на лету.
Это также возможно с использованием фильтров CSS, которые применить прямо в браузере. Эти пользовательские свойства фильтра имеют широкую поддержку во многих браузерах, и они отлично выглядят.
С Плагин Philter JavaScript, Вы можете масштабировать этот процесс, чтобы сэкономить время и переместить свой код в HTML для эффекты динамического фильтра.
Используя этот плагин, вы получаете намного больший контроль над вашими изображениями. Таким образом, вы можете выбрать, какие фильтры вы хотите применить к отдельным изображениям, и нужно ли менять определенные фильтры в зависимости от поведения пользователя, например, зависания..
CSS поддерживает анимированные переходы и Филтер делает этот процесс действительно простым. Вы просто скачиваете Philter с домашней страницы или из репозитория GitHub. Как только он будет добавлен на вашу веб-страницу, вы просто добавить код инициализации и отпустить.
Вот образец фрагмента из репозитория GitHub:
По умолчанию вы можете настроить переходы и дополнительные атрибуты данных что вы можете добавить в HTML. URL Параметр определяет путь, по которому Philter должен искать пользовательские файлы SVG, используемые в процессе фильтрации..
Эти дополнительные фильтры упакован с библиотекой, поэтому вам не нужно редактировать их вообще. Но вы можете переместить их или поместить в другую структуру каталогов из вашего текущего файла, поэтому этот параметр возможно, придется изменить.
Теперь вы можете просто добавить пользовательские фильтры прямо на ваш HTML
Вот простой пример:
Вы можете найти полный список всех фильтров на GitHub, вместе с полное руководство по настройке и много других примеров кода.
Philter - один из самых крутых бесплатных плагинов, который расширяет границы современного CSS. Вы можете даже создайте свои собственные фильтры если вы готовы копаться в кодовой базе и возиться.
Чтобы начать с простого, просто зайдите на домашнюю страницу Philter и загрузите копию. Вы можете запустить его в кратчайшие сроки.
