ימים
שעות
דקות
שניות
הזדרזי! המבצע בתוקף עד 04.04.2024

איך להפוך את צבע הרקע של האזור של ההידר לשקוף בגלילה? (הוא הופך לסטיקי)

הדרך הטובה ביותר לשנות את צבע הרקע של הheader לשקוף בגלילה, היא על ידי שינוי צבע הרקע מצבע אטום לצבע שקוף למחצה.

השלבים להוספת קוד CSS שיהפוך את צבע הרקע של האזור של ההדר לשקוף בגלילה

  1. קודם כל – בדקי שהוספת הגדרת Sticky נכונה להדר.
  2. בCSS מותאם אישית של האזור של ההדר, הדביקי את הקוד הבא:
.elementor-sticky--active{
    transition: all 0.5s ease !important;
}

.elementor-sticky--effects{
    background-color: #FFFFFF80 !important;
    transition: all 0.5s ease !important;
}
  1. כעת צבע הרקע (background-color) של האזור של ההדר יתחלף לך ללבן שקוף למחצה.
  2. את יכולה לבחור שצבע הרקע ישתנה לכל צבע שקוף שאת רוצה, או שקוף לגמרי.
  3. כדי לבחור צבע אחר, את צריכה את הקוד ההקסדצימלי שלו + קוד שקיפות (השתמשי בכלי להוספת שקיפות בקוד על מנת להוסיף שקיפות לצבע).

לדוגמה, הקוד ההקסדצימלי הבא מתאים לצבע שחור אטום:

#000000

ואם תוסיפי לו קוד 80 בסופו, הוא יהפך לשקוף למחצה:

#00000080

ואז עלייך להחליף בקוד CSS לעיל את הbackground-color לצבע השחור השקוף למחצה שיצרת, ככה:

.elementor-sticky--active{
    transition: all 0.5s ease !important;
}

.elementor-sticky--effects{
    background-color: #00000080 !important;
    transition: all 0.5s ease !important;
}

את יכולה להפוך את צבע הרקע של האזור של ההדר לשקוף לגמרי, על ידי שימוש בצבע רקע עם שקיפות מלאה כמו

#FFFFFF00

רק שעלייך לשים לב שההדר עדיין יהיה קריא וברור בגלילה על גבי העמודים באתר.

תצליחי,
חגית

2 תגובות

כתיבת תגובה

הדרכות נוספות שיכולות לעזור לך

אלופה, יש לך רעיונות מבריקים?

איך גוגל קורא את האתר שלך, ולמה חשוב שהמבנה שלו יהיה… אנושי!

למה חשוב להשקיע בשירות לקוחות?

איזה עמודים חייבים לשים באתר תדמית?

בניתי עמוד כבד באלמנטור ואני לא מצליחה לעדכן שינויים. (מקבלת שגיאה 500 מהשרת) מה עושים?

איך מסננים ליסטינג גריד שנבנה עבור חנות, שיופיעו בו מוצרים קשורים בעמוד מוצר? והאם יש אפשרות להציג מוצרים קשורים גם בלי ג’ט?

איך מחברים אתר וורדפרס לגוגל אנליטיקס 4, ואיך אפשר לגלות מאיפה הגיעו הגולשים לאתר?

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

כלים אלופים

10 כלים מומלצים
שיעזרו לך לעבוד מהר יותר
דילוג לתוכן