JavaScript Screen unlockOrientation() Method

What You’ll Learn

Screen.unlockOrientation() is a deprecated, non-standard instance method that cleared every orientation lock the page or app had set. Learn the no-argument call, the old vendor prefixes, when it could run (installed apps / fullscreen), and how to migrate to screen.orientation.unlock()—with five examples and try-it labs.

Introduction

After a game locked the screen to landscape, it often needed a way to let the device rotate freely again. Older APIs did that with screen.unlockOrientation().

That approach is obsolete. Modern browsers unlock via the ScreenOrientation object from screen.orientation. This tutorial covers the legacy method so you can read old code and migrate it safely. Pair it with lockOrientation() when you meet both in the same codebase.

// Legacy only — do not use in new apps
// screen.unlockOrientation();

Understanding the Method

MDN: the unlockOrientation() method of the Screen interface removes all the previous screen locks set by the page/app.

• Instance method — historically on window.screen.
• Deprecated & Non-standard — not in any specification.
• Parameters — none.
• Return — true unlocked / false could not unlock.

📝 Syntax

unlockOrientation()

Parameters

None.

Return value

A boolean: true if the orientation was successfully unlocked, false if it could not be unlocked.

🎯 Prefer ScreenOrientation.unlock()

// Modern idea
if (screen.orientation && typeof screen.orientation.unlock === "function") {
  screen.orientation.unlock();
  console.log("called orientation.unlock()");
}

🛡️ Legacy Feature-Detection Pattern

MDN’s examples normalize prefixed names (and sometimes fall through to modern unlock). Use this only when reading old code—not for new apps.

const unlockOrientationUniversal =
  screen.unlockOrientation ||
  screen.mozUnlockOrientation ||
  screen.msUnlockOrientation;

console.log(typeof unlockOrientationUniversal);

Examples Gallery

Examples follow MDN Screen.unlockOrientation(). Labs feature-detect and usually do not change your display—they report API availability.

const unlockOrientationUniversal =
  screen.unlockOrientation ||
  screen.mozUnlockOrientation ||
  screen.msUnlockOrientation;

if (typeof unlockOrientationUniversal === "function") {
  console.log("legacy unlockOrientation API present");
} else {
  console.log("unlockOrientation not supported (expected on modern browsers)");
}

unlockOrientation not supported (expected on modern browsers)

const unlockOrientationUniversal =
  screen.unlockOrientation ||
  screen.mozUnlockOrientation ||
  screen.msUnlockOrientation;

if (typeof unlockOrientationUniversal !== "function") {
  console.log("API missing; would have called unlockOrientation()");
} else {
  const ok = unlockOrientationUniversal();
  console.log(ok ? "Orientation was unlocked" : "Orientation unlock failed");
}

API missing; would have called unlockOrientation()

const unlockOrientation =
  screen.unlockOrientation ||
  screen.mozUnlockOrientation ||
  screen.msUnlockOrientation ||
  (screen.orientation && screen.orientation.unlock);

let branch = "none";
if (screen.unlockOrientation || screen.mozUnlockOrientation || screen.msUnlockOrientation) {
  branch = "legacy boolean unlock";
} else if (screen.orientation && screen.orientation.unlock) {
  branch = "modern orientation.unlock (void)";
}

console.log({
  typeofUnlock: typeof unlockOrientation,
  branch,
  tip: "Prefer calling screen.orientation.unlock() directly in new code."
});

{
  "typeofUnlock": "function",
  "branch": "modern orientation.unlock (void)",
  "tip": "Prefer calling screen.orientation.unlock() directly in new code."
}

const hasModern =
  !!(screen.orientation && typeof screen.orientation.unlock === "function");

console.log({
  hasModernUnlock: hasModern,
  currentType: screen.orientation ? screen.orientation.type : "(none)",
  tip: "Prefer screen.orientation.unlock() in new apps."
});

{
  "hasModernUnlock": true,
  "currentType": "landscape-primary",
  "tip": "Prefer screen.orientation.unlock() in new apps."
}

console.log({
  unlockOrientation: typeof screen.unlockOrientation,
  mozUnlockOrientation: typeof screen.mozUnlockOrientation,
  msUnlockOrientation: typeof screen.msUnlockOrientation,
  orientationUnlock: screen.orientation
    ? typeof screen.orientation.unlock
    : "no screen.orientation",
  status: "legacy unlockOrientation is deprecated & non-standard"
});

{
  "unlockOrientation": "undefined",
  "mozUnlockOrientation": "undefined",
  "msUnlockOrientation": "undefined",
  "orientationUnlock": "function",
  "status": "legacy unlockOrientation is deprecated & non-standard"
}

🚀 Common Use Cases

• Reading / migrating old fullscreen games that called unlockOrientation.
• Understanding vendor-prefixed orientation unlock history.
• Pairing with legacy lockOrientation() during audits.
• Teaching why orientation APIs are restricted to apps / fullscreen.
• Planning a move to screen.orientation.unlock().

🔧 How It Works

📝 Notes

• Deprecated and Non-standard (MDN)—both banners shown above.
• Not Experimental on MDN.
• Not part of any specification; prefer ScreenOrientation.unlock().
• Historically limited to installed Web apps or fullscreen pages.
• Related: lockOrientation(), change, orientation, Window hub, JavaScript hub.

💡 Best Practices