ניסיתי לחפש ולא מצאתי משהו (אולי כי אני לא כל כך יודעת להגדיר את סוג האינמציה..)אתם רוצים ליצור אנימציה פשוטה על טקסט?
באנימציות פשוטות, אתם יכולים לעשות את זה בCSS, וזה גם עדיף על האנימציות של אנגולר (המבוססות על JS) שנתמכות פחות וגם קצת פחות מהירות.
תכתבו בגוגל (באנגלית כמובן) את סוג האנימציה שאתם רוצים + CSS ותקבלו דוגמאות קוד לרוב.
אתם יכולים לנסות לכתוב גם כאן בצורה מפורטת יותר את האנימציה אותה אתם צריכים.
תראו את הדוגמה הזאתניסיתי לחפש ולא מצאתי משהו (אולי כי אני לא כל כך יודעת להגדיר את סוג האינמציה..)
האינמציה שאני רוצה:
יש לי מילה שנמצאת בגובה מסוים ואני רוצה שטיפול מהגובה הזה לתחתית העמוד או הפוך נמצאת בתחתית העמוד ומטפסת למיקום מסוים שאני יגדיר לה
ואני רוצה שיראו תמסלול לא שתקפוץ מנקודה אחת לאחרת
אשמח אם מישהו יוכל להגדיר לי איך זה נקרא? או לתת קישור
ממש יעזור
תודה רבה!!
<html>
<div class="object">
טקסט לדוגמא
</div>
<style>
.object {
animation: MoveUpDown 1s linear infinite;
position: absolute;
left: 0;
bottom: 0;
}
@keyframes MoveUpDown {
0%, 100% {
transform: translateY(0);
}
50% {
transform: translateY(-100px);
}
}
</style>
</html>
וואי תודהHTML:<html> <div class="object"> טקסט לדוגמא </div> <style> .object { animation: MoveUpDown 1s linear infinite; position: absolute; left: 0; bottom: 0; } @keyframes MoveUpDown { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-100px); } } </style> </html>
בתגית ה style זה ה CSS, אפשר לכתוב אותו בקובץ נפרדוואי תודה
בדיוק מה שאני צריכה
רק כמה שאלות על הקוד:
1. כל מה שבתוך התגית STYLE אני יכולה לרשום ב CSS? ( מה מומלץ??)
2. ואיפה ההגדרה של נקודת ההתחלה והסיום
ואני גם רוצה שיפסיק - יגיע לנקודת הסיום ויעצור
בקוד הספציפי הזה האלמנט ירד למטה ויעלה חזרה למעלה.0%, 100% { transform: translateY(0); }
@keyframes MoveUpDown {
0% {
transform: translateY(0);
}
100% {
transform: translateY(-1000px);
}
אפשר להוסיף את המאפיין animation-delay לעיצוב של האובייקט.עוד שאלה:
אם יש לי כמה טקסטים שאני מציגה אותם ב NGFOR ואני רוצה שהטקסט הבא בתור יתחיל לזוז שהטקסט הקודם הגיע למקומו הסופי - איך אני מגדירה את זה?
תודה רבה
אין אפשרות לעשות את זה במשהו כמו FOR ?אפשר להוסיף את המאפיין animation-delay לעיצוב של האובייקט.
בשביל כמה אלמנטים משתמשים ב nth-child ולכל אחד נותנים את ה delay המתאים.
ב CSS זה בלתי אפשרי, ב SCSS כן.אין אפשרות לעשות את זה במשהו כמו FOR ?
יש לי מערך של מילים וכל מילה אמורה להיות מוצגת עם הבדלים של כמה סנטימטרים מהמילה הקודמת
חבל לי לעשות על כל איבר עיצוב בנפרד
יש דרך ב CSS שהמיקום יהיה i שגדל - שיהיה קשר נגיד בין ה i במערך שמתקדם לבין המיקום?
מקווה שהייתי מובנת..
תודה רבה
איך ב SCSS?ב CSS זה בלתי אפשרי, ב SCSS כן.
אפשר ב- TS או עם Jquery.
איך ב SCSS?
נראה שכןלא התעמקתי. רק מלמעלה, בתקווה שזה באמת מתאיםIs there a way to use the "n" value in :nth-child(n)?
I want to create a fold effect. Fiddle There are 4 blue cards, so I created 4 classes to set the location. I want to make it smarter, in case there would be more than 4 cards. In CSS, I tried thi...stackoverflow.com
אל תחמיצו!!!
מנוי פרימיום באתר פרוג, יקפיץ את המוניטין שלך לקהל גדול שאסור לך להחמיץ!
ועכשיו בהזדמנות, מבצע פסח 10% הנחה ברכישת מנוי שנתי!
לוח לימודים
מסלולי לימוד שאפשר לההצטרף
אליהם ממש עכשיו:
2.04
כ"ג אדר ב'
השקה חגיגית
חדש בפרוג
קורס חדשנות AI ובינה מלאכותית
14 שיעורים מפוצצים תוכן על כלי הAI השונים ליצירת תמונות וויז'ואל, עריכת וידאו ומושן, כתיבה ורעיונות, אפיון ועיצוב אתרים ועוד המון!
ההרשמה נפתחה!
20.03
י' אדר ב'
פתיחת מסלול
עיצוב ואדריכלות פנים
מלגות גבוהות!
26.03
טז' אדר ב'
פתיחת מסלול
מאסטר בשיווק דיגיטלי
מלגות גבוהות!
8.05
ל' ניסן
פתיחת מסלול
אוטומציות עסקיות, בוטים והטמעת מערכות מידע
מלגות גבוהות!
9.05
א' אייר
ירושלמי?
יש לנו מלגה מטורפת עבורך! קורס במימון כמעט מלא!!
אוטומציות עסקיות, בוטים והטמעת מערכות מידע
ההרשמה בעיצומה
28.05
כ' אייר
פתיחת מסלול מורחב:
פיתוח ובניית אתרים
מלגות גבוהות!
תהילים פרק קכא
א שִׁיר לַמַּעֲלוֹת אֶשָּׂא עֵינַי אֶל הֶהָרִים מֵאַיִן יָבֹא עֶזְרִי:ב עֶזְרִי מֵעִם יְהוָה עֹשֵׂה שָׁמַיִם וָאָרֶץ:ג אַל יִתֵּן לַמּוֹט רַגְלֶךָ אַל יָנוּם שֹׁמְרֶךָ:ד הִנֵּה לֹא יָנוּם וְלֹא יִישָׁן שׁוֹמֵר יִשְׂרָאֵל:ה יְהוָה שֹׁמְרֶךָ יְהוָה צִלְּךָ עַל יַד יְמִינֶךָ:ו יוֹמָם הַשֶּׁמֶשׁ לֹא יַכֶּכָּה וְיָרֵחַ בַּלָּיְלָה:ז יְהוָה יִשְׁמָרְךָ מִכָּל רָע יִשְׁמֹר אֶת נַפְשֶׁךָ:ח יְהוָה יִשְׁמָר צֵאתְךָ וּבוֹאֶךָ מֵעַתָּה וְעַד עוֹלָם: