Studio Editor: הוספת אנימציית גלילה
זמן קריאה: 4 דקות
אנימציית גלילה עוזרת לכם ליצור חוויית גלישה אטרקטיבית ומקצועית יותר. התקדמות האנימציה מקושרת ישירות למיקום הגלילה – האלמנט נחשף או משתנה בזמן שהגולשים גוללים למעלה ולמטה.
הנושאים בעמוד הזה:
הוספת אנימציית גלילה
כדי להוסיף אנימציית גלילה חדשה, בחרו את האלמנט שמפעיל אותה. האנימציה שתבחרו מתחילה כאשר אהגולשים גוללים מעבר לאלמנט הזה. לאחר מכן תצטרכו להחליט לאיזה אלמנט תתווסף האנימציה ולבחור נתיב לאנימציה.
כדי להוסיף אנימציית גלילה:
- בחרו את האלמנט או המקטע הרלוונטיים.
- הקליקו על החץ לפתיחת חלונית ה-Inspector (עריכה)
בפינה הימנית העליונה של ה-Editor. - הקליקו על הטאב Interactions
(אינטראקציות). - הקליקו על + Add (הוספה) תחת Scroll (גלילה).
- הגדירו את האנימציה:
- ב-Animated element בחרו באיזה אלמנט תהיה האנימציה.
- ב-Animation path בחרו איך תתחיל האנימציה, ביחס לאלמנט שעיצבתם. אתם יכולים להפוך את העיצוב על הקנבס לנקודת ההתחלה של האנימציה (From its design) או לנקודת הסיום (To its design).
- בחרו אנימציה מהרשימה.
טיפ: עברו עם העכבר מעל האנימציות כדי לראות אותן בתצוגה מקדימה.
התאמה אישית של אנימציית גלילה
אחרי שבחרתם את האנימציה, הגדירו אותה כך שתפעל בדיוק כמו שאתם רוצים. ההגדרות האפשריות תלויות באנימציה הספציפית שבחרתם.
כדי לערוך אנימציית גלילה:
- בחרו את האלמנט או המקטע הרלוונטיים.
- הקליקו על החץ לפתיחת חלונית ה-Inspector (עריכה) בפינה הימנית העליונה של ה-Editor.
- הקליקו על הטאב Interactions (אינטראקציות).
- הקליקו על האנימציה שאתם רוצים לשנות.
- הקליקו על Adjust Animation כדי לשנות את ההגדרות שלה:
- Direction: בחרו את הכיוון שממנו האנימציה תגיע (למשל משמאל או מלמעלה).
- Scale: הגדירו את גודל היעד של האלמנט באנימציה. לדוגמה, 80% אומר שהאלמנט באנימציה יתכווץ ב-20%.
- Distance: החליטו כמה רחוק האלמנט יתקדם באנימציה.
- Animation area: החליטו באיזו נקודה בזמן הגלילה האנימציה תתחיל ותפסיק. 0% הוא תחתית המסך ו-100% הוא החלק העליון. לדוגמה, אם הגדרתם את האזור ל-100%, האנימציה תתחיל כשהאלמנט יהיה בתחתית המסך, ותסתיים כשהוא יגיע לחלק העליון.
טיפ:
הפעילו את המתג Scroll to preview כדי לראות את האנימציה שאתם יוצרים, ישירות על הקנבס.
הסרת אנימציית גלילה
בכל שלב אפשר להסיר אנימציית גלילה דרך חלונית ה-Inspector (עריכה).
כדי להסיר אנימציית גלילה:
- בחרו את האלמנט או המקטע הרלוונטיים.
- הקליקו על החץ לפתיחת חלונית ה-Inspector (עריכה) בפינה הימנית העליונה של ה-Editor.
- הקליקו על הטאב Interactions (אינטראקציות).
- עברו עם העכבר מעל האנימציה והקליקו על אייקון הפעולות הנוספות
. - הקליקו על Remove (הסרה).
זה עזר לך?
|