1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>Title</title>
    6.     <style>
    7.         *{
    8.             margin: 0;
    9.             padding: 0;
    10.             list-style: none;
    11.             text-decoration: none;
    12.         }
    13.         #square{
    14.             width: 100px;
    15.             height: 100px;
    16.             background-color: #fac;
    17.             position: absolute;
    18.             left: 50px;
    19.             top: 50px;
    20.         }
    21.     </style>
    22. </head>
    23. <body>
    24.     <div id="square"></div>
    26.     <script>
    27.         const square = document.getElementById("square");
    28.         function move() {
    29.             if (square.offsetLeft>700){
    30.                 return;
    31.             }
    32.             square.style.left = square.offsetLeft + 10 + 'px';
    33.             requestAnimationFrame(move);
    34.         }
    35.         move();
    36.     </script>
    37. </body>
    38. </html>