خاصیت animation-fill-mode در CSS

یک نمونه ساده از خاصیت animation-fill-mode:

animation-fill-mode: forwards;

آزمایشگاه

تعریف و کاربرد

خاصیت animation-fill-mode یک سبک یا استایل را برای خاصیت انیمیشنی که قبل از شروع یا بعد ازاتمام آن که اجرا نمی شود تعیین می کند.

#	توضیحات
مقدار پیشفرض	خالی
ارث بری	خیر
انیمیشن	خیر
نسخه	CSS3
نگارش JS	object.style.animationFillMode="forwards"

اعدادی که در فیلد های مرورگر ها درج شده اند، بیانگر ورژن ساپورت کننده خاصیت animation-fill-mode هستند.

#	کروم	ادج	فایرفاکس	سافاری	اپرا
animation-fill-mode

animation-fill-mode: none|forwards|backwards|both|initial|inherit;

مقادیر	توضیحات
none	انیمیشن از هیچ مقداری پیروی نمی کند.
forwards	مقدار مربوطه استایلی را که توسط آخرین framekey تعیین شده باشد را برای انیمیشن فعال می کند.
backwards	مقدار مربوطه استایلی را که توسط اولین framekey تعیین شده باشد را برای انیمیشن فعال می کند.
both	انیمیشن از قوائد رو به جلو و سپس عقب بهره می برد.
initial	این مقدار را به ویژگی پیش فرض خود اضافه می کند.
inherit	این مقدار را از تگ والد خود به ارث می برد.

آموزش CSS: انیمیشن‌های CSS

مرجع HTML DOM: ویژگی animationFillMode

CSS Reference

مرجع CSS

خاصیت های CSS