Drone

const drone = document.getElementById("drone");

let x = 135;

let y = 135;

document.addEventListener("keydown", (event) => {

  const step = 5; // Movement step size

  switch (event.key) {

    case "ArrowUp": // Move up

      if (y - step >= 0) y -= step;

      break;

    case "ArrowDown": // Move down

      if (y + step <= 270) y += step;

      break;

    case "ArrowLeft": // Move left

      if (x - step >= 0) x -= step;

      break;

    case "ArrowRight": // Move right

      if (x + step <= 270) x += step;

      break;

    default:

      break;

  }

  // Update drone position

  drone.style.top = `${y}px`;

  drone.style.left = `${x}px`;

});