এই উদাহরণটি 29টি বেজিয়ার বক্ররেখা CSS3 টেমপ্লেট সরবরাহ করে, সমস্ত কোড ইন্টারনেট থেকে নেওয়া হয়েছে! আপনি এই সাধারণ cubic-bezier বক্ররেখা টেমপ্লেটগুলি নিজের ব্যবহারের জন্য ব্যবহার করতে পারেন, অথবা বেজিয়ার বক্ররেখা টুল ব্যবহার করে নিজের জন্য উপযুক্ত cubic-bezier অ্যানিমেশন প্রভাব তৈরি করতে পারেন। বেজিয়ার বক্ররেখা 4টি বিন্দু দ্বারা গঠিত, CSS3 বেজিয়ার বক্ররেখা ফাংশনে, ডিফল্ট শুরুর বিন্দুর স্থানাঙ্ক (0,0) এবং শেষ বিন্দুর স্থানাঙ্ক (1,1), সুতরাং আপনাকে শুধুমাত্র অবশিষ্ট 2টি দিক বিন্দু নিয়ন্ত্রণ করতে হবে, একটি সম্পূর্ণ বেজিয়ার বক্ররেখা পেতে! শুধুমাত্র CSS3 প্রভাব সমর্থন করে এমন ব্রাউজারগুলিতে প্রভাব দেখা যাবে!
-webkit-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
-moz-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
-o-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);-webkit-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
-moz-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
-o-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
আপনি সাম্প্রতিককালে ব্যবহার করেছেন: