איך ליצור הידר שמשנה צבע בגלילה.
היי, חברים בסרטון הזה אנחנו נראה שני אפשרויות (אחד עם קוד ואחד עם תוסף)איך אפשר לעשות שצבע ההידר (התפריט העליון) ישתנה אחרי שגוללים את המוד.
האפקט הזה נפוץ מאוד, באחת מהשניים או שבתחילה ההידר שקוף ובגלילה הוא מקבל צבע, או להיפך שבתחילה יש לו צבע מלא ובגלילה הוא הופך שקוף למחצה.
עוד דבר נפוץ הוא להקטין את אזור ההידר אחרי הגלילה, וגם זה נראה בסרטון.
כל הקודים נמצאים מתחת לסרטון,
selector{
transition: all 1s ease-in-out;
}
selector.elementor-sticky--effects {
background-color: #E85718 !important;
opacity: 0.50 !important;
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
}
selector > .elementor-container
{
transition: 1s ease-in-out;}
selector.elementor-sticky--effects > .elementor-container
{
min-height: 80px !important;
height: 80px;
}
והנה קישור לתוסף,
3 תגובות
היי רוני קודם כל תודה רבה על כל הידע שאתה משתף אני נהנה מאד מהשיעורים והפוסטים שלך ומחכה לעוד..
לגבי הקודים ששיתפת משום מה הם לא עובדים אצלי כשאני מעתיק ומדביק אותם ל css מותאם של תפריט הניווט..
תוכל לעבור עליהם שוב לראות אולי חסר איזה פיסקה..
תודה רבה !
מדריך מעולה! תודה רבה 🙂
שאלה קטנה, במידה וההידר שקוף והתפריט לבן ולאחר מכן בגלילה רקע התפריט נהיה לבן ולא רואים את התפריט. יש דרך לשנות את צבע התפריט רק במצב גלילה?
תודה מראש,
תודה רבה!
הערה קטנה – לגבי שימוש בתוסף שהמלצת – מתקבלת הודעת שגיאה מוורדפרס שאחד ההוקים שהתוסף משתמש בהם הוצא משימוש