কম্পিউটার

CSS ব্যবহার করে একটি ধীর শেষের সাথে অ্যানিমেশন সেট করুন


অ্যানিমেশন-টাইমিং-ফাংশন ব্যবহার করুন সম্পত্তি, CSS

এর সাথে ধীর শেষের সাথে অ্যানিমেশন সেট করতে সহজ-আউট মান সহ

উদাহরণ

<!DOCTYPE html>
<html>
   <head>
      <style>
         div {
            width: 150px;
            height: 200px;
            position: relative;
            background-color: #808000;
            animation-name: myanim;
            animation-duration: 2s;
            animation-direction: alternate-reverse;
            animation-iteration-count: 3;
         }
         @keyframes myanim {
            from {left: 100px;}
            to {left: 200px;}
         }
         #demo {animation-timing-function: ease-out;}
      </style>
   </head>
   <body>
      <div id = "demo">ease-out effect</div>
   </body>
</html>

  1. CSS এর সাথে সমস্ত অ্যানিমেশন বৈশিষ্ট্য সেট করতে শর্টহ্যান্ড প্রপার্টি

  2. CSS ব্যবহার করে অ্যানিমেশন চলমান বা পজ করা হচ্ছে কিনা তা সেট করুন

  3. CSS ব্যবহার করে ধীরগতির সাথে অ্যানিমেশন সেট করুন

  4. CSS দিয়ে শুরু থেকে শেষ পর্যন্ত একই গতিতে একটি অ্যানিমেশন সেট করুন