خصوصیت animation-fill-mode CSS

تعریف و استفاده

animation-fill-mode ویژگی تعیین می‌کند که آیا اثر انیمیشن در نمایش قبل یا بعد از پخش قابل مشاهده است یا خیر.

توضیحات:مقدارهای ویژگی پر کردن از یک یا چند کلمه کلیدی پر کردن با کاما از هم جدا شده‌اند.

لطفاً به:

آموزش CSS3:آنی‌سازی CSS

دستورالعمل مرجع HTML DOM:ویژگی animationFillMode

مثال

حالت پر کردن برای عنصر h1 تعیین می‌کند:

h1
  {
  animation-fill-mode: forwards;
  }

قوانین CSS

animation-fill-mode : none | forwards | backwards | both;
مقدار توضیحات
خیر رفع رفتار پیش‌فرض.
forwards پس از اتمام انیمیشن، مقادیر آخرین فریم (در آخرین فریم کلیدی تعریف شده) را حفظ می‌کند.
backwards در مدت زمان مشخص شده توسط animation-delay، قبل از نمایش انیمیشن، مقادیر اولیه را اعمال می‌کند (در اولین فریم کلیدی تعریف شده).
هر دو هر دو حالت پر کردن به سمت جلو و عقب اعمال می‌شوند.

جزئیات فنی

مقدار پیش‌فرض: خیر
ارث‌پذیری: خیر
نسخه: CSS3
قوانین جاوااسکریپت: اجسام.style.animationFillMode=none

پشتیبانی مرورگر

اعداد در جدول نشان‌دهنده نسخه اولین مرورگر هستند که از این ویژگی کامل پشتیبانی می‌کند.

با استفاده از پیشوند -webkit-،-moz- یا -o-، اعداد اولین نسخه‌ای که از پیشوند استفاده می‌کند نشان داده می‌شود.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
43.0
4.0 -webkit-		 10.0 16.0
5.0 -moz-		 9.0
4.0 -webkit-		 30.0
15.0 -webkit-
12.1
12.0 -o-