檢測負載上的電話方向

Question

這是可以在頁面加載時使用Javascript進行檢查。我知道你可以檢測到方向的改變，但是可以檢查手機立刻處於什麼狀態？

由於

Answer 1

你可以檢查視口的寬度和高度，看看哪一個是較大的：

var isLandscapeMode = window.innerWidth > window.innerHeight; 

if (isLandscapeMode) { 
    // fit page to wide orientation here... 
} 

有關移動設備的視口尺寸的更深入的討論，請參閱 http://www.quirksmode.org/mobile/viewports2.html

（更新代碼）

Answer 2

您可以這樣做...

var currOrientation= ''; 
/************************ 
* Changes the (obj) element's class, to 
* -vrt (vertical) 
* -hrz (horizontal) 
* depending on its width 
*************************/ 
var orientation = function(obj){ 
    var w = getWidth(), 
     h = getHeight(); 

    if(w <= h && currOrientation !== 'vrt'){ 
     obj.className = 'vrt'; 
     currOrientation = 'vrt'; 
    } 
    else if(currOrientation !== 'hrz') { 
     obj.className = 'hrz'; 
     currOrientation = 'hrz'; 
    } 
} 
/************************ 
* Binding a repeating timer 
************************/ 
var orientationINIT = function() { 
    var content; 
    if((content = document.getElementsByTagName('body')[0]) != undefined){ 
     orientation(content); 

     var Orient = setInterval(function() { 
      orientation(content); 
     }, 500); //each 500ms a call for orientation change 
    } 
} 

orientationINIT應該被稱爲上頁面加載或DOM完成（或在頁面的底部）

其中的getHeight（）和的getWidth（）應該是在數返回窗口的寬度/高度簡單的功能形成。