animation-duration প্রপার্টি
animation-duration প্রপার্টি
অ্যানিমেশনের সময়কাল নির্ধারণ করে।
সিনট্যাক্স
সিলেক্টর {
animation-duration: s বা ms-এ সময়;
}
মানসমূহ
| মান | বর্ণনা |
|---|---|
s |
সেকেন্ডে সময় নির্দিষ্ট করে (উদাহরণস্বরূপ 3s)। |
ms |
মিলিসেকেন্ডে সময় নির্দিষ্ট করে (উদাহরণস্বরূপ 3ms)। এক সেকেন্ড হল 1000 মিলিসেকেন্ড। |
ডিফল্ট মান: 0s।
উদাহরণ
এই উদাহরণে, অ্যানিমেশনটি 3 সেকেন্ড ধরে চলবে:
<div id="elem"></div>
@keyframes move {
from {
margin-left: 0px;
}
to {
margin-left: 400px;
}
}
#elem {
animation-duration: 3s;
animation-name: move;
animation-iteration-count: infinite;
animation-timing-function: linear;
border: 1px solid black;
width: 50px;
height: 50px;
}
:
আরও দেখুন
-
animation-nameপ্রপার্টি,
যা অ্যানিমেশনের নাম নির্ধারণ করে -
animation-delayপ্রপার্টি,
যা অ্যানিমেশন শুরু হওয়ার আগে বিলম্ব নির্ধারণ করে -
animation-timing-functionপ্রপার্টি,
যা অ্যানিমেশন চলার গতি নির্ধারণ করে -
animation-iteration-countপ্রপার্টি,
যা অ্যানিমেশন পুনরাবৃত্তির সংখ্যা নির্ধারণ করে -
animation-directionপ্রপার্টি,
যা অ্যানিমেশনের দিক নির্ধারণ করে -
animation-fill-modeপ্রপার্টি,
যা অ্যানিমেশনের অবস্থা নির্ধারণ করে -
animation-play-stateপ্রপার্টি,
যা অ্যানিমেশনটি বিরতিতে রাখতে দেয় -
animationপ্রপার্টি,
যা অ্যানিমেশনের জন্য একটি সংক্ষিপ্ত রূপ -
@keyframesকমান্ড,
যা অ্যানিমেশনের কী-ফ্রেম নির্ধারণ করে -
transitionমসৃণ ট্রানজিশন, যা এলিমেন্টে হোভার করার সময় অ্যানিমেশন দেখায়