Philter.js - Gratis afbeelding Wijzigingsbibliotheek met behulp van CSS-filters
Instagram is algemeen bekend als het populairste fotonetwerk. Het behandelt meer dan 52 miljoen foto's per dag en veel van hen inclusief filters die beelden tijdens de vlucht veranderen.
Dit is ook mogelijk met behulp van CSS-filters die solliciteer direct in de browser. Deze aangepaste filtereigenschappen hebben brede ondersteuning in veel browsers en zien er geweldig uit.
Met de Philter JavaScript-plug-in, u kunt dit proces schalen om tijd te besparen en uw code naar HTML te verplaatsen dynamische filtereffecten.
Door deze plug-in te gebruiken, wint u veel meer controle over uw afbeeldingen. Op deze manier kunt u kiezen welke filters u op afzonderlijke afbeeldingen wilt toepassen en of bepaalde filters moeten worden gewijzigd op basis van gebruikersgedrag, zoals zweven.
CSS ondersteunt geanimeerde overgangen en Philter maakt dit proces echt eenvoudig. Je download gewoon Philter van de startpagina of van de GitHub-repo. Zodra het is toegevoegd aan uw webpagina, hoeft u alleen maar voeg de initialisatiecode toe en laat het gaan.
Hier is een voorbeeldfragment van de repito van GitHub:
Standaard kunt u dit doen overgangen en extra gegevensattributen instellen die je in HTML kunt toevoegen. De url parameter definieert het pad waar Philter naar aangepaste SVG-bestanden moet zoeken die worden gebruikt in het filterproces.
Deze extra filters zijn verpakt met de bibliotheek, dus je hoeft ze helemaal niet te bewerken. Maar u kunt ze verplaatsen of in een andere directorystructuur van uw huidige bestand plaatsen, dus deze instelling moet mogelijk worden gewijzigd.
Nu kan je gewoon voeg aangepaste filters toe recht op uw HTML
Hier is een eenvoudig voorbeeld:
U kunt een vinden volledige lijst met alle filters op GitHub, samen met een complete installatiehandleiding en vele andere codevoorbeelden.
Philter is een van de coolste gratis plug-ins die er zijn en hij verlegt de grenzen van moderne CSS. Je kan zelfs ontwerp je eigen filters als je bereid bent om in de codebasis te graven en te sleutelen.
Voor een eenvoudige plek om te beginnen, gaat u naar de startpagina van de Philter en downloadt u een exemplaar. U kunt het binnen de kortste keren in gebruik hebben.
