Source Code:
(back to article)
Submit
Result:
Report an issue
<head> <style> #square { width: 50px; height: 50px; background-color: green; position: absolute; left: 0; top: 0; } </style> </head> <body> <div id="square"></div> <script> const square = document.getElementById('square'); let pos = 0; function moveRight() { if (pos < window.innerWidth - 50) { pos += 2; square.style.left = pos + 'px'; requestAnimationFrame(moveRight); } else { pos = 0; requestAnimationFrame(moveDown); } } function moveDown() { if (pos < window.innerHeight - 50) { pos += 2; square.style.top = pos + 'px'; requestAnimationFrame(moveDown); } } moveRight(); </script> </body>