خصوصیت animation-name
مثال (خصوصیت animation-name)
اتصال عنصر <div> به قانون keyframes@ با استفاده از نام انیمیشن:
animation-name:mymove;
-webkit-animation-name:mymove; /* Safari and Chrome */
خودتان امتحان کنید »-webkit-animation-name:mymove; /* Safari and Chrome */
پشتیبانی مرورگرها
مرورگرهای Internet Explorer 10, Firefox, Opera خصوصیت animation-name را پشتیبانی می کنند.
مرورگرهای Chrome و Safari به پیشوند -webkit- نیاز دارند.
توجه: مرورگر Internet Explorer 9 و نسخه های قبلی آن، این امکان را پشتیبانی نمی کند.
تعریف و کاربرد
با استفاده از خصوصیت animation-name، می توانید قانون keyframes@ را به عنصر مورد نظرتان متصل نمایید.
keyframes@ جایی است که در آن انیمیشن ایجاد می شود. داخل keyframes@ یک Style مشخص می کنیم و انیمیشن بتدریج از Style جاری به Style جدید تغییر می کند.
| مقدار پیشفرض | none |
|---|---|
| ارث بری | خیر |
| نسخه | CSS3 |
| JavaScript ساختار | object.style.animationName="mymove" |
نحوه استفاده
animation-name: keyframename|none;
| مقدار | توضیحات |
|---|---|
| keyframename | نامی که در قانون keyframes@ تعریف کرده ایم را مشخص می کند. |
| none | مشخص می کند که انیمیشنی وجود ندارد. (می توان از آن برای لغو کردن انیمیشن هایی که بصورت آبشاری اجرا می شوند، استفاده نمود) |
بیاموزهای مرتبط
CSS3 Animation (بیاموز CSS3)
- نوشته شده توسط امیر پهلوان صادق
- بازدید: 6931
