জাভাস্ক্রিপ্ট দিয়ে অ্যানিমেশন তৈরি

জাভাস্ক্রিপ্ট দিয়ে অ্যানিমেশন তৈরি করার কোড নিচে দেওয়া হলো -

উদাহরণ

<!DOCTYPE html> <html> <style>    body{       font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;    }    button{       padding:10px;       font-size: 18px;       background-color: blue;       color:white;       border:none;       margin-bottom:10px;    }    .Animation {       width: 60px;       height: 60px;       position: absolute;       background-color: rgb(134, 25, 207);    } </style> <body> <h1>Animation using JS example</h1> <button onclick="startAnimation()">Start Animation</button> <div class ="Animation"></div> <script>    function startAnimation() {       var elem = document.querySelector(".Animation");       var pos = 0;       var id = setInterval(frame, 10);       function frame() {          if (pos == 450) {             clearInterval(id);          } else {             pos++;             elem.style.borderRadius = pos/14 + 'px';             elem.style.left = pos + 'px';          }       }    } </script> </body> </html>

আউটপুট

উপরের কোড নিচের আউটপুট দেবে -

'Start Animation' বাটনে ক্লিক করলে -