בנה מגניב CSS אנימציות בקלות עם
יש טונות של CSS אנימציה באינטרנט יישומי אינטרנט - -. אבל, מעט מאוד להשוות את רמת פירוט וקלות השימוש שאתה מקבל עם אנימסטה.
זה יישום אינטרנט חינם מאפשר לך ליצור אישית אנימציות CSS בלחיצת כפתור. אתה בוחר בין תנועות מתוכננות מראש כגון שקופיות, טרנספורמציות, נדנדות, ואפילו אנימציות צל.
לאחר יצירת האנימציה שלך, תוכל לייצא את הקוד בדיוק כמו עם גנרטורים אחרים CSS. אלא, קוד זה הרבה יותר קל לעבוד עם ואפילו מגיע עם כלי מכני מובנה.
הממשק יכול להרגיש מבלבל בהתחלה אבל זה רק בגלל כמה אפשרויות יש לך!
אתה בונה הנפשות מותאמות אישית שלושה שלבים עיקריים ושימוש בממשק מלמעלה למטהYou
- בחר סגנון תנועה (נדנדה, שקף, להעיף בקנה מידה) מהמעגלים בראש
- התאם אותו עם סוגי תנועה שונים מתחת
- ערוך את אפשרויות ההנפשה שלך בסרגל האפשרויות בצד שמאל
באמצעות תהליך זה, אתה יכול לשנות את משך הזמן הכולל של האנימציה, סגנון ההקלה, העיכוב, פחות או יותר הכל. והכול עובד באמצעות CSS טהור, מה שהופך אותו אפילו מרשים יותר.
כמו כן, שים לב ב navbar העליון מאוד אתה יכול אפילו לבחור בין סוגים שונים של סגנונות יעד אנימציה.
ה ברירת המחדל היא “בסיסי” אשר יכול לעבוד על כל דבר כמעט (רחף, לחץ, או אנימציה מיידית). מטרות אחרות כוללות טקסט טקסט, אנימציות רקע, ואפילו אנימציות כניסה מותאמות אישית כדי להביא אלמנט דף מוסתר אל התצוגה.
אני אוהב במיוחד את “תשומת הלב” קישור בחלק העליון שבו יש כמה מגניב לנער & להתעצבן ההשפעות על סגנונות כפתור. פעולות אלו פועלות על לחצני קריאה לפעולה כדי למשוך תשומת לב ולעודד אינטראקציות משתמש.
לאחר שתסיים לבצע התאמות, אתה פשוט לחץ על סמל הסוגר הקטן בפינה השמאלית העליונה של חלונית התצוגה המקדימה.
זה מביא דף חדש עם נוף את CSS מלא בכיתה אנימציה, יחד עם keyframes. תכונות אופציונליות מאפשרות לך לעשות זאת צמצם את הקוד ו כולל את הקידומת האוטומטית התומך בדפדפני אינטרנט ישנים יותר.
השתמשתי טונות של כלים מותאמים אישית CSS אנימציה ללא ספק Animista הוא הכלי תכונה עשיר ביותר שם בחוץ. זה לגמרי בחינם קצת מורכב בהתחלה אבל ברגע שאתה מבין את הממשק, זה ללא ספק הגנרטור הטוב ביותר שאתה יכול להשתמש.
כדי לנסות, פשוט בקר בדף הבית ולחץ על “נסה אותי”. תוכל גם לשתף את המחשבות והמחמאות שלך עם יוצר האפליקציה @ ana108.
