一般來說，橫豎屏的檢測方式有下面幾種：
使用瀏覽器自帶事件orientationchange和瀏覽器物件window.orientation能夠完美進行橫豎螢幕切換。依據參考資料一，此事件在有些瀏覽器中使用繫結在body元素上的屬性來實現，僅僅有在頁面發生css重排後才會被觸發。解決此問題的方法是在body上新增乙個css類。用來觸發css的重排，詳細css**例如以下：
.portrait
body
div.landscape
body
div
var updateorientation = function
() // set the class on the html element (i.e. )
document.body.parentnode.setattribute('class', orientation);
};// event triggered every 90 degrees of rotation
window.addeventlistener('orientationchange', updateorientation, false);
詳細**例如以下：
@media all and (orientation: portrait)
}@media all and (orientation: landscape)
}
var updateorientation = function
() ;
// initialize the orientation
updateorientation();
// update every 5 seconds
setinterval(updateorientation, 5000);
**例如以下：
(function
() // set the class on the html element (i.e. )
htmlnode.setattribute('class', orientation);
}} else } updateorientation(); } var init = function
() else } window.addeventlistener('domcontentloaded', init, false); })();
國外大神移動端研究
很多其它內容請檢視zakwu的小站
IOS橫屏豎屏問題
引言 iphone的橫屏豎屏針對ios系統版本分為兩種開發方式 一種是ios 6之前的使用模式 一種是ios6的新模式.兩者的區別還是蠻大的.使用 支援自動旋轉?ios6之前通常使用 shouldautorotatetointe ceorientation 來單獨控制某個uiviewcontroll...
Android設定橫屏後鎖屏問題
最近專案中，用到了橫屏。並且通過fragment做了tab頁效果。做ui的過程中ui展現沒有發現問題，但是今天上午，偶爾卻發現，當手機鎖屏時，我的fragment會銷毀掉，activity也會銷毀掉，並且fragment和activity會重啟。這個之前印象中，鎖屏只會onpause相違背。解決了一...
用JavaScript判斷橫屏豎屏問題
判斷手機橫豎屏狀態 function hengshuping if window.orientation 90 window.orientation 90 window.addeventlistener onorientationchange in window orientationchange ...