פילטר. תמונה חינם שינוי ספריה באמצעות CSS מסננים

אינסטגרם הוא ידוע בתור רשת הצילום הפופולרי ביותר. הוא מטפל מעל 52 מיליון תמונות ביום ורבים מהם כולל מסננים כי לשנות תמונות על לטוס.

זה אפשרי גם באמצעות מסנני CSS אשר החל ישירות בדפדפן. למאפיינים המסננים המותאמים אישית יש תמיכה רחבה בדפדפנים רבים והם נראים נהדר.

עם ה תוסף, אתה יכול לשנות את התהליך הזה כדי לחסוך זמן ולהעביר את הקוד שלך ב- HTML עבור אפקטים דינמיים מסנן.

באמצעות תוסף זה, אתה מרוויח שליטה רבה יותר על התמונות שלך. בדרך זו אתה יכול לבחור אילו מסננים ברצונך להחיל על תמונות בודדות ואם מסננים מסוימים צריכים להשתנות בהתאם להתנהגות המשתמש כגון ריחוף.

CSS תומך מעברים אנימציה ופילטר עושה את התהליך הזה פשוט. אתה פשוט להוריד את פילטר מהבית או מתוך ריפו GitHub. ברגע שזה יתווסף לדף האינטרנט שלך, אתה פשוט הוסף את קוד האתחול ולתת לו ללכת.

הנה קטע טקסט מן ריפו GitHub:

כברירת מחדל, תוכל להגדיר מעברים ותכונות נתונים נוספות שניתן לצרף ב- HTML. ה כתובת אתר הפרמטר מגדיר את הנתיב שבו פילטר צריך לחפש קובצי SVG מותאמים אישית המשמשים בתהליך הסינון.

מסננים נוספים אלה הם ארוז עם הספרייה, אז אתה לא צריך לערוך אותם בכלל. אבל, אתה יכול להזיז אותם מסביב או למקם אותם לתוך מבנה ספרייה שונה מהקובץ הנוכחי שלך, אז הגדרה זו ייתכן שיהיה צורך לשנות.

עכשיו, אתה יכול פשוט הוסף מסננים מותאמים אישית מימין ל- HTML שלך אלמנטים או מכולות שלהם.

הנה דוגמה פשוטהYou

אתה יכול למצוא רשימה מלאה של כל המסננים על GitHub, יחד עם מדריך התקנה מלאה ודוגמאות קוד רבות אחרות.

פילטר הוא אחד plugins בחינם מגניב סביב וזה דוחף את גבולות CSS המודרני. אתה יכול אפילו עיצוב מסננים משלך אם אתה מוכן לחפור לתוך codebase ו להתעסק מסביב.

לקבלת מקום פשוט להתחיל, פשוט בקר בדף הבית של פילטר והורד עותק. אתה יכול לקבל את זה & פועל בתוך זמן קצר.