אפקט זכוכית לרקע באתר – שעובד בכל המכשירים

איפה להוסיף את הקוד?

באתרי Elementor:
עברו לאלמנט שאליו אתם רוצים להחיל את האפקט.
לחצו על "מתקדם" > "CSS מותאם אישית".

שימו לב
חשוב באלמנטור: כדי שהאפקט יעבוד, עליכם להוריד את השקיפות של הרקע באלמנטור ל-50% או יותר. ניתן לעשות זאת בקלות דרך הגדרות הרקע > שקיפות.
בדיקות: ודאו שהאפקט מופיע כראוי במכשירים שונים ודפדפנים (iPhone, Android, Chrome, וכו').

selector {
/* טשטוש ורוויה */
-webkit-backdrop-filter: blur(16px) saturate(180%);
backdrop-filter: blur(16px) saturate(180%);

/* רקע שקוף למחצה */
background-color: rgba(255, 255, 255, 0.5);

/* מניעת בעיות */
overflow: visible;
-webkit-transform: translateZ(0);
transform: translateZ(0);
position: relative;
}