פיתוח

אנימציות CSS משוגעות עם אלמנטור!

מאת חיים בניסטי

הקבצים:

הקודים שבסרטון:

    
     /*--------------אופנוע------------*/


/*גלגלים*/
#right-wheel, #left-wheel{
    animation: wheels 4s infinite linear;
    transform-box: fill-box;
    transform-origin: center;
}

@keyframes wheels{
    from{
        transform: rotate(0deg);
    }
    to{
        transform: rotate(360deg);
    }
}


/*גוף*/
#body{
    animation: body 0.4s infinite alternate;
    transform-box: fill-box;
    transform-origin: bottom;
}

@keyframes body{
    0%{
        transform: rotatex(0deg);
    }
    
    100%{
        transform: rotatex(16deg);
    }
}


/*---------------רקע-------------*/


/*רקע ראשון*/
#section{
    animation: background-1 8000s infinite linear;
}

@keyframes background-1{
    from{
        background-position: 10000vw;
    }
}


/*רקע שני*/
#section .elementor-background-overlay{
    animation: background-2 5000s infinite linear;
}

@keyframes background-2{
    from{
        background-position: 10000vw;
    }
}


/*רקע שלישי*/
#column .elementor-widget-wrap{
    animation: background-3 2500s infinite linear;
}

@keyframes background-3{
    from{
        background-position: 10000vw;
    }
}


/*רקע רביעי*/
#column .elementor-background-overlay{
    animation: background-4 1400s infinite linear;
}

@keyframes background-4{
    from{
        background-position: 10000vw;
    }
}
    
   
Subscribe
Notify of
3 תגובות
Newest
Oldest Most Voted
Inline Feedbacks
View all comments
אלעד ינאי
1 year ago

תוכל אולי להראות איך הקובץ אופנוע מחולק לתיקיות בXD?

מירי
1 year ago

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

מאיר
19 days ago
Reply to  מירי

צריך לעשות כמו כל הכללים בסרטון
ב. צריך לקחת את הקלאס של התמונה מכלי המפתחים של כרום

שניכנס לתא הטייס?

שכחת סיסמה?

שחזור סיסמה:

שכח את הסיסמה? הזן את שם המשתמש או כתובת הדואר אלקטרוני. תקבל קישור לאיפוס סיסמה באמצעות דואר אלקטרוני.

או