یک جعبهٔ مربع بساز که با استفاده از ویژگی animation بهصورت پیوسته بچرخد و همزمان رنگ پسزمینهاش تغییر کند.
3.0 بازدید آخرین ویرایش در 220 روز قبل ساعت 01:59 0.0
با استفاده از CSS و @keyframes یک انیمیشن تعریف کنید که در فریمهای مختلف مقدار transform (مثلاً rotate) و background-color را تغییر دهد، سپس با صفت مختصر animation نام انیمیشن، مدت زمان، تابع زمانی و شمار تکرار (مثلاً infinite و alternate) را تنظیم کنید؛ برای کارآیی بهتر از transform بهجای تغییر موقعیت استفاده کنید و در صورت نیاز animation-fill-mode یا تأخیر (animation-delay) را اضافه کنید. نمونهسازی و آزمایش در مرورگر کافی است و میتوانید برای سازگاری قدیمیها prefixهای مربوطه را بهکار ببرید.
توسط پژوهشگر در 220 روز قبل ساعت 01:59 1 پاسخ
جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من
در حال بارگیری...
برای ارسال پاسخ باید با حساب کاربری وارد شوید.
ورود به حساب کاربری
برای ساخت جعبهٔ مربعی که با animation بچرخد و پسزمینهاش هم تغییر کند، یک @keyframes تعریف کن که در فریمهای مختلف مقدار rotate و background-color را همزمان تغییر دهد. برای کارایی بهتر از transform بهجای تغییر موقعیت استفاده کن و مطمئن شو transform-origin درست تنظیم شده باشد. از ترکیب خلاصهای مثل animation: spin 5s linear infinite alternate استفاده کن و اگر لازم است animation-fill-mode: both را اضافه کن. برای سازگاری قدیمیها پیشوندهای -webkit- را اضافه کن و در نهایت تست در مرورگرهای مختلف انجام بده.
گزارش