خصوصیت animation-delay
مثال (خصوصیت animation-delay)
بعد از 2 ثانیه انتظار، انیمیشن اجرا می شود:
animation-delay:2s;
-webkit-animation-delay:2s; /* Safari and Chrome */
خودتان امتحان کنید »
-webkit-animation-delay:2s; /* Safari and Chrome */
در انتهای این بیاموز، مثال های بیشتری را خواهید دید.
پشتیبانی مرورگرها
مرورگرهای Internet Explorer 10, Firefox, Opera خصوصیت animation-delay را پشتیبانی می کنند.
مرورگرهای Chrome و Safari به پیشوند -webkit- نیاز دارند.
توجه: مرورگر Internet Explorer 9 و نسخه های قبلی آن، این امکان را پشتیبانی نمی کند.
تعریف و کاربرد
با استفاده از خصوصیت animation-delay می توانید زمان شروع انیمیشن را تعیین نمایید.
مقدار animation-delay به ثانیه (s) یا میلی ثانیه (ms) تعیین می شود.
نکته: مقادیر منفی قابل قبول است، بعنوان مثال، مقدار 2s- باعث می شود که انیمیشن بلافاصله اجرا شود اما شروع آن 2 ثانیه جلوتر از حالت عادی است.
| مقدار پیشفرض | 0 |
|---|---|
| ارث بری | خیر |
| نسخه | CSS3 |
| JavaScript ساختار | object.style.animationDelay="2s" |
نحوه استفاده
animation-delay: time;
| مقدار | توضیحات | نمایش دادن |
|---|---|---|
| time | اختیاری است. تعیین می کند که قبل از شروع انیمیشن چه مقدار باید منتظر بمانیم. این مقدار به ثانیه (s) یا میلی ثانیه (ms) تعیین می شود. مقدار پیشفرض 0 است. | نمایش دادن » |
مثال - خودتان امتحان کنید
مثال (خصوصیت animation-delay)
مقدار منفی، توجه داشته باشید که شروع انیمیشن 2 ثانیه جلوتر از حالت عادی است.
animation-delay: -2s /* W3C and Opera */
-moz-animation-delay: -2s /* Firefox */
-webkit-animation-delay: -2s /* Safari and Chrome */
خودتان امتحان کنید »-moz-animation-delay: -2s /* Firefox */
-webkit-animation-delay: -2s /* Safari and Chrome */
بیاموزهای مرتبط
CSS3 Animation (بیاموز CSS3)
- نوشته شده توسط امیر پهلوان صادق
- بازدید: 8152
