Screen.orientation

これは実験的な機能です。本番で使用する前にブラウザー実装状況をチェックしてください。

orientationScreen インターフェイスの読み取り専用プロパティで、現在の画面の向きを返します。

構文

var orientation = window.screen.orientation;

返値

画面の向きを表す ScreenOrientation のインスタンスです。

なお、古い接頭辞付きのものは DOMStringScreenOrientation.type と同等のものを返していました。

var orientation = screen.msOrientation || screen.mozOrientation || (screen.orientation || {}).type;

if (orientation === "landscape-primary") {
  console.log("良い感じですね。");
} else if (orientation === "landscape-secondary") {
  console.log("うーん…。画面が上下逆です!");
} else if (orientation === "portrait-secondary" || orientation === "portrait-primary") {
  console.log("うーん…。スクリーンを横向きにした方がいいですよ");
} else if (orientation === undefined) {
  console.log("このブラウザーは orientation API に対応していません :("); 
}

仕様書

仕様書 状態 備考
Screen Orientation API
orientation の定義
草案 初回定義

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
orientationChrome 完全対応 38Edge ? Firefox 完全対応 あり
完全対応 あり
完全対応 あり
接頭辞付き
接頭辞付き moz のベンダー接頭辞が必要
IE 完全対応 11
接頭辞付き 補足
完全対応 11
接頭辞付き 補足
接頭辞付き ms のベンダー接頭辞が必要
補足 Not supported on Windows 7.
Opera 完全対応 25Safari 未対応 なしWebView Android 未対応 なしChrome Android 完全対応 39Firefox Android 完全対応 あり
完全対応 あり
完全対応 あり
接頭辞付き
接頭辞付き moz のベンダー接頭辞が必要
Opera Android 未対応 なしSafari iOS 未対応 なしSamsung Internet Android 完全対応 あり

凡例

完全対応  
完全対応
未対応  
未対応
実装状況不明  
実装状況不明
実装ノートを参照してください。
実装ノートを参照してください。
使用するには、ベンダー接頭辞または異なる名前が必要です。
使用するには、ベンダー接頭辞または異なる名前が必要です。

関連情報