בסרטון הבא נראה אך ליצור אנימצייה יפה של תמונות רקע שונות בעת מעבר עכבר על הכרטיסים, גם אפשר להשתמש בטכניכה הזאת לאפשרויות רבות.
הקוד שבסרטון:
.my-img-1,.my-img-2,.my-img-3{
opacity: 0;
transform: scale(1.1);
transition: 2s;
}
.my-con:has(.my-text-1:hover) .my-img-1{
opacity: 1;
transform: scale(1);
}
.my-con:has(.my-text-2:hover) .my-img-2{
opacity: 1;
transform: scale(1);
}
.my-con:has(.my-text-3:hover) .my-img-3{
opacity: 1;
transform: scale(1);
}
וככה זה נראה:
כותרת אלמנט
לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית לפרומי בלוף קינץ תתיח לרעח.
כותרת אלמנט
לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית לפרומי בלוף קינץ תתיח לרעח.
כותרת אלמנט
לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית לפרומי בלוף קינץ תתיח לרעח.
3 תגובות
מדהים! אהבתי מאוד! תודה רבה
מגניב לגמרי!
עוקב אחרי הניוזלטרים שלך, כל פעם עם חידוש אחר!
תותח על חלל!
תודה רבה!
נהנית מאוד מכל המדיכים המעולים
שאלה – יש אפשרות ליצור את הדבר הזה על ווידג’ט פוסטים? ז”א שבמעבר על כל פוסט תשתנה התמונה?