והפעם לכבוד תחילת השבוע, ויום ראשון האהוב על כולנו. 😣 לאחת האנימציות האהובות עלי - svg שמצייר את עצמו על המסך. האנימציה נפוצה מאוד כמו בדוגמא שאצרף, כקריצה חמודה אחרי שליחה של טופס וכדומה. והמפתיע: שאפשר לעשות אותה בcss בלבד. ♥ העיקרון: אנחנו "מקוקוים" את הקו של הsvg בקו באורך כל הקו עצמו מה שגורם לו להיראות ריק, ואז בהדרגה אנחנו חושפים את הקו. ובעזרת animation-fill-mode אנחנו מבקשים מהאנימציה שאחרי שהיא מסיימת שתישאר על המצב הסופי שהוא בעצם הsvg המלא. וחלאס. מגניב או כן? תחיו לנצח ולא תמותו אפעם. שבוע מבורך 🚀

איך לגרום ל-SVG "לצייר את עצמו" בעזרת CSS בלבד
• זמן קריאה: 1 דקות
אחת האנימציות הכי כיפיות - SVG שמצייר את עצמו בלי טיפת JavaScript! בפוסט נבין את הטריק הפשוט, למה הוא עובד, ואיך להוסיף טאץ' מגניב לטפסים ולאפליקציות.