تعریف انیمیشن و استفاده از آن در css

انیمیشن می تواند یکی از اون سوال های حیله گرانه در حین مصاحبه باشد که طراحان وتولیدکنندگان داخلی و خارجی از عهده اش بر می آیند به هر حال می تونه نیرنگ آمیز باشد و با توجه به اینکه خیلی ساده شروع می شود که شامل ساختن یک فریم کلیدی بر اساس ترتیب که می تواند تغییر کند و تغییرات اعمال شده می تواند بر اساس قوانین سی اس اس باشد.

انیمیشن ها هم مثل transition ها ویژگی های نمایشی عناصر را در طول زمان تغییر می دهند. تفاوت اصلی در این است که ترنزیشن ها به طور خودکار در زمان تغییر یک ویژگی (مثلا در زمان رویداد hover) عمل می کنند اما انیمیشن ها زمانی که به صورت دستی ویژگیanimation اعمال شود, عمل می کنند. به همین دلیل برای به وجود آوردن یک انیمیشن نیاز است که تغییرات ویژگی های یک عنصر را که قرار است متحرک سازی شود در یک keyframes@ تعریف کرده و سپس از آن بوسیله ویژگی animation استفاده کنیم.

شما می توانید در هنگام انیمیشن سازی ابتدای و انتهای انیمیشن مورد نظر خودتان را به صورت آهسته نمایش دهید و حتی می توانید انیمیشن را در هنگام پخش آن را با تاخیر روبه روکنید

و به این کار میگن قانون کامبو.

در داخل سی اس اس قانون کامبو را داریم و قوانین خیلی خاص زیادی دیگر که همه ی این ها در یک انیمیشن اتفاق می افتد.

پس خیلی مهمه که بدونید تغییراتی را روی انیمیشن انجام دهید و انهارا با استفاده از جاوا اسکریپت

کنترل کنید

برای یادگیری کار با انیمیشن در css بصورت عملی فایل بازتولید بنده از سایت لیندا را میتوانید در لینک زیر ببینید: