移动端--判断横竖屏

Posted 面包_girl

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了移动端--判断横竖屏相关的知识,希望对你有一定的参考价值。

(function(){
var supportOrientation = (typeof window.orientation === ‘number‘ &&
typeof window.onorientationchange === ‘object‘);
var init = function(){
var htmlNode = document.body.parentNode,
orientation;
var updateOrientation = function(){
if(supportOrientation){
orientation = window.orientation;
switch(orientation){
case 90:
case -90:
orientation = ‘landscape‘;
break;
default:
orientation = ‘portrait‘;
break;
}
}else{
orientation = (window.innerWidth > window.innerHeight) ? ‘landscape‘ : ‘portrait‘;
}
htmlNode.setAttribute(‘class‘,orientation);
};
if(supportOrientation){
window.addEventListener(‘orientationchange‘,updateOrientation,false);
}else{
//监听resize事件
window.addEventListener(‘resize‘,updateOrientation,false);
}
updateOrientation();
};
window.addEventListener(‘DOMContentLoaded‘,init,false);
})();

 

以上是关于移动端--判断横竖屏的主要内容,如果未能解决你的问题,请参考以下文章

移动端--判断横竖屏

检测手机横竖屏切换

orientation属性判断横竖屏

JS检测移动端横竖屏

JavaScript 监听移动端横竖屏状态的几种方式

JavaScript 监听移动端横竖屏状态的几种方式