判斷頁面是橫屏還是豎屏

在h5頁面中必須要在html頭部加上這個

理解：1)、content中的width指的是虛擬視窗的寬度。

2)、user-scalable=no就一定可以保證頁面不可以縮放嗎？no，有些瀏覽器不吃這一套，還有一招就是minimum-scale=1.0, maximum-scale=1.0 最大與最小縮放比例都設為1.0就可以了。

3)、initial-scale=1.0 初始縮放比例受user-scalable控制嗎？不一定，有些瀏覽器會將user-scalable理解為使用者手動縮放，如果user-scalable=no，initial-scale將無法生效。

4)、手機頁面可以觸控移動，但是如果有需要禁止此操作，就是頁面寬度等於螢幕寬度是頁面正好適應螢幕才可以保證頁面不能移動。

5)、如果頁面是經過縮小適應螢幕寬度的，會出現乙個問題，當文字框被啟用（獲取焦點）時，頁面會放大至原來尺寸。

可以分成兩個方法實現區分手機豎屏和橫屏的效果：

js判斷

//判斷手機橫豎屏狀態：

window.addeventlistener("onorientationchange" in window ? "orientationchange" : "resize", function()  
if (window.orientation === 90 || window.orientation === -90 )  
}, false); 
//移動端的瀏覽器一般都支援window.orientation這個引數，通過這個引數可以判斷出手機是處在橫屏還是豎屏狀態。

css判斷

這是在乙個檔案中

@media screen and (orientation: portrait)  

@media screen and (orientation: landscape)

因為可能豎屏和橫屏的樣式是不一樣的 所以需要分成兩個檔案

豎屏

橫屏

android 橫屏豎屏判斷

方法1 displaymetrics dm new displaymetrics getwindowmanager getdefaultdisplay getmetrics dm int width dm.widthpixels int height dm.heightpixels 方法2 if t...

判斷手機是橫屏還是豎螢幕

media screen and orientation portrait media screen and orientation landscape 分開寫在2個css中 豎屏橫屏 判斷手機橫豎屏狀態 window.addeventlistener onorientationchange in ...

移動端判斷橫屏豎屏

可能我們在寫移動端專案的時候會有要求或者為了更好的體驗會做橫豎屏檢測，以達到更好的使用者體驗。判斷橫豎屏 var utils delay var detectres document.getelementbyid j detectres var detectdata document.getelem...