js 判斷手機橫豎屏的實現方法（不依賴任何其餘庫）

時間 2019-12-11

原文原文鏈接

<!DOCTYPE html> 
<html>
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml;charset=UTF-8" />
<meta name="viewport" content="width=device-width" />
<title>手機橫、豎屏事件</title> 
<script language="javascript" type="text/javascript">
//屏幕方向標識，0橫屏，其餘值豎屏
var orientation=0;
//轉屏事件，內部功能能夠自定義
function screenOrientationEvent(){
    if(orientation == 0)document.getElementById("change").value="豎";
    else document.getElementById("change").value="橫";
}
var innerWidthTmp = window.innerWidth;
//橫豎屏事件監聽方法
function screenOrientationListener(){
    try{
        var iw = window.innerWidth;     
        //屏幕方向改變處理
        if(iw != innerWidthTmp){
            if(iw>window.innerHeight)orientation = 90;
            else orientation = 0;
            //調用轉屏事件
            screenOrientationEvent();
            innerWidthTmp = iw;
        }
    } catch(e){alert(e);};
    //間隔固定事件檢查是否轉屏，默認500毫秒
    setTimeout("screenOrientationListener()",500);
}
//啓動橫豎屏事件監聽
screenOrientationListener();
</script>
</head> 
<body onload="screenOrientationEvent()"> 
<input id="change" type="text" value=""/>
</body>
</html>

引用：http://www.dewen.net.cn/q/8694/javascript