Reverses left and top

To match the ball motion with device rotation
himanshugarg · Oct 30, 2023 · 4f6d034 · 4f6d034
1 parent 3a41ffd
commit 4f6d034
Showing 1 changed file with 2 additions and 2 deletions.
diff --git a/...s/en-us/web/api/device_orientation_events/detecting_device_orientation/index.md b/...s/en-us/web/api/device_orientation_events/detecting_device_orientation/index.md
@@ -124,8 +124,8 @@ function handleOrientation(event) {
 
   // 10 is half the size of the ball
   // It center the positioning point to the center of the ball
-  ball.style.top = `${(maxY * y) / 180 - 10}px`;
-  ball.style.left = `${(maxX * x) / 180 - 10}px`;
+  ball.style.left = `${(maxY * y) / 180 - 10}px`; // rotating device about Y axis moves the ball along X
+  ball.style.top = `${(maxX * x) / 180 - 10}px`;  // rotating device about X axis moves the ball along Y
 }
 
 window.addEventListener("deviceorientation", handleOrientation);