transition প্রপার্টি
transition প্রপার্টি - মসৃণ পরিবর্তনের জন্য সংক্ষিপ্ত, এটি একই সাথে
transition-duration,
transition-property,
transition-timing-function
এবং transition-delay
সেট করতে দেয়।
সিনট্যাক্স
সিলেক্টর {
transition: মান;
}
প্রপার্টিগুলোর ক্রম কোনো বিষয় নয়, তবে
সময়কাল (transition-duration)
বিলম্বের (transition-delay) আগে থাকতে হবে।
মানসমূহ
সংশ্লিষ্ট প্রপার্টিগুলো দেখুন। ডিফল্ট
মান: all 0s ease 0s।
none মান সব পরিবর্তন বাতিল করে
(সেগুলো তাৎক্ষণিকভাবে ঘটবে)।
উদাহরণ
ব্লকটির উপর মাউস নিন - 3 সেকেন্ড
কিছুই ঘটবে না (³s বিলম্ব আছে),
তারপর এটি 2 সেকেন্ডে তার প্রস্থ
মসৃণভাবে পরিবর্তন করবে। তারপর যদি মাউস
সরানো হয় - আবার 3 সেকেন্ড কিছুই
ঘটবে না, তারপর প্রস্থ মসৃণভাবে প্রারম্ভিক
মানে কমে যাবে:
<div id="elem"></div>
#elem {
border: 1px solid black;
transition: width 2s ease 3s;
width: 100px;
height: 50px;
}
#elem:hover {
width: 400px;
}
:
আরও দেখুন
-
animationপ্রপার্টি,
যার সাহায্যে অ্যানিমেশন তৈরি করা যায়