星期一, 3月 10, 2014

HTML5 中 window.orientation 屬性

在行動裝置的瀏覽器上, 提供有 window.orientation 屬性, 可以讓你判別裝置的擺向, 以下這篇文章透過實際的實驗, 告訴你不同裝置對於這個屬性的結果, 有照片直接對照, 非常清楚:

A misconception about window.orientation – Matthew Gifford

簡單來說, 若是 90 或是 -90, 就是橫向, 其他值 (只有可能是 180 或是 0) 就是直向。90 對大部分裝置都是指螢幕上邊轉向左邊橫擺, -90 則是螢幕上邊轉向右邊橫擺 (但有的裝置在這種情況下仍然傳回 90)。0 在大部分裝置是正常直擺, 180 則是整個反轉 (但有個裝置在這種情況下仍然傳回 0)。

要特別注意的是, 平板通常是以寬邊為基準, 直擺時是短邊在左右兩側, 和手機不同。如果是有實體 home 鈕, 不管手機或是平板, 都是以 home 為直擺的下邊, 這樣就不會弄錯了。 

沒有留言: