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

אפקט CSS לשינוי תמונת רקע לקונטיינר במעבר על כפתור, עם אלמנטור בלי תוספים!

לאיכות צפיה ברמה גבוהה לחצי על גלגל השיניים מתחת לכל סרטון > איכות > 1080p

השלבים להכנת אפקט CSS לשינוי תמונת רקע לקונטיינר במעבר על כפתור

  1. פתחי את העמוד הרצוי באלמנטור > הוסיפי קונטיינר ראשי > פריסה > כיוון > מימין לשמאל
  2. בתוך הקונטיינר הוסיפי 3 כפתורים ואחריהם קונטיינר פנימי
  3. הגדירי לקונטיינר החיצוני ולקונטיינר הפנימי גובה זהה (בסרטון הגובה של שניהם הוא 100vh)
  4. בחרי את הקונטיינר הפנימי > סגנון > רקע > בחרי תמונת רקע
  5. המשיכי עם הקונטיינר הפנימי > מתקדם > מיקום > מוחלט > ובCSS Classes > כתבי bg
  6. הוסיפי את הקוד הבא לכל כפתור שבתוך הקונטיינר הראשי

הקוד לאפקט CSS לשינוי תמונת רקע לקונטיינר במעבר על כפתור באלמנטור

selector:hover ~ .bg{
   background-image: url('https://chagit.alufot.co.il/wp-content/uploads/bg1.svg') !important;
}

שימי לב להחליף את תמונת הרקע לכל כפתור.

4 תגובות

כתיבת תגובה

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

איך אפשר להגדיר מחיר מוצר לפי כמות? לדוגמא אם קונים 1 עולה 300 ש”ח ליחידה, אם קונים 2 – 250 ש”ח ליחידה

איך מאפשרים כניסה לאתר וורדפרס רק על ידי סיסמה?

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

יצרתי סינון עם smart-filter לליסטינג גריד של ג’ט איך אפשר להגדיר שלא יוצג בכלל פוסטים עד שבוחרים לפחות 2 אפשרויות סינון (לדוג: מחיר ויצרן)

טיפים לסגירת עסקה מוצלחת עם לקוח שכבר קבל הצעת מחיר

איך אפשר להוסיף אייקון SVG לכפתור בוידג’ט הנעה לפעולה של אלמנטור?

איך להפוך את שירות הלקוחות שלך – לחוויה!

האם יש אפשרות ליצור בלוג אחד המכיל בתוכו גם פוסטים רגילים וגם פוסטים מוגנים בסיסמה?

כלים אלופים

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