Philter.js - Bibliothèque de retouche d'images gratuite à l'aide de filtres CSS
Instagram est largement connu comme le réseau de photo le plus populaire. Il traite plus de 52 millions de photos par jour et beaucoup d’entre elles inclure des filtres qui altère les images à la volée.
Ceci est également possible en utilisant des filtres CSS qui appliquer directement dans le navigateur. Ces propriétés de filtre personnalisées sont largement prises en charge par de nombreux navigateurs et ont l’air superbe.
Avec le Plugin JavaScript Philter, vous pouvez adapter ce processus pour gagner du temps et déplacer votre code en HTML pour effets de filtres dynamiques.
En utilisant ce plugin, vous gagnez beaucoup plus de contrôle sur vos images. De cette façon, vous pouvez choisir les filtres que vous souhaitez appliquer à des images individuelles et si certains filtres doivent changer en fonction du comportement de l'utilisateur, tel que le survol.
CSS prend en charge les transitions animées et Philter rend ce processus très simple. Vous venez de télécharger Philter à partir de la page d'accueil ou du dépôt GitHub. Une fois ajouté à votre page Web, il vous suffit de ajouter le code d'initialisation et laisse tomber.
Voici un échantillon extrait du repo GitHub:
Par défaut, vous pouvez configurer des transitions et des attributs de données supplémentaires que vous pouvez ajouter en HTML. le url paramètre définit le chemin où Philter doit rechercher les fichiers SVG personnalisés utilisés dans le processus de filtrage.
Ces filtres supplémentaires sont emballé avec la bibliothèque, vous n'avez donc pas besoin de les éditer du tout. Mais, vous pouvez les déplacer ou les placer dans une structure de répertoires différente de celle de votre fichier actuel. peut avoir besoin d'être modifié.
Maintenant, vous pouvez juste ajouter des filtres personnalisés droit à votre HTML
Voici un exemple simple:
Vous pouvez trouver un liste complète de tous les filtres sur GitHub, avec un guide d'installation complet et de nombreux autres exemples de code.
Philter est l’un des plugins gratuits les plus cools et repousse les limites du CSS moderne. Vous pouvez même concevez vos propres filtres si vous êtes prêt à creuser dans la base de code et à bricoler.
Pour un endroit simple, commencez par vous rendre sur la page d’accueil de Philter et téléchargez-en un exemplaire. Vous pouvez l'avoir en place en un rien de temps.
