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

איך אפשר להוסיף לכותרת באלמנטור אנימציית תנועה מצד לצד במסך?

אנימציית תנועה תוכלי להוסיף על ידי כתיבת קוד CSS מותאם אישית.

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

  1. לחצי על וידג’ט כותרת > מתקדם > CSS מותאם אישית > הדביקי את הקוד הבא:
selector .elementor-heading-title{
   animation: slide 10s linear 0s infinite !important;
}

@keyframes slide{
    0%{
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }
    100%{
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}

ומיד האנימציה תתחיל לעבוד!

אנימציית תנועה לכותרת
  1. קבעי את מהירות האנימציה (כמה שניות תארך האנימציה) ע”י החלפת המספר 10 במספר אחר. לדוגמה:
selector .elementor-heading-title{
   animation: slide 5s linear 0s infinite !important;
}

כעת המהירות עומדת על 5 שניות לכל אורך האנימציה, והיא פועלת מהר יותר.

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

  1. כדי להתאים את האנימציה לכותרת באנגלית – יש לשנות את הכיוון שלה באנימציה, ככה:
selector .elementor-heading-title{
   animation: slide 10s linear 0s infinite !important;
}

@keyframes slide{
    0%{
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
    100%{
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }
}

ויש גם התאמה רספונסיבית! הקוד מותאם לכל סוגי המסכים, ומתבסס על רוחב המסך.

תצליחי,
חגית

9 תגובות

  1. תודה על האתר המוצלח!
    שאלה,
    אני רוצה לשים באתר טקסט שיזוז מימין לשמאל ברעיון של אתר “כל רגע” (במבזקים)
    ואני רוצה שהלקוח יוכל להעלות תכנים מהוורדפרס בלי לפתוח שדות וכו’
    מה הדרך הכי טובה לעשות את זה?

כתיבת תגובה

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

איך לחסום ספאם המגיע מהטפסים באתר?

איך אני מגדירה בהצגת הגריד שיהיה מיושר לאמצע? הוא אמור להציג 2-4 פוסטים, ואני רוצה שיהיה בכל פעם ממורכז לאמצע.

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

איך אפשר להוסיף כפתור סגירה או כפתור חזרה בתוך עמוד רגיל, כך שיראה כמו פופאפ?

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

צביעת מילים מסויימות בתוך טקסט באלמנטור

איך ליישר את שדה הטלפון לימין בטופס אלמנטור – פתרון לבאג ועזרה מבינה מלאכותית

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

כלים אלופים

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