码迷,mamicode.com
首页 > 移动开发 > 详细

JS检测移动端横竖屏

时间:2016-12-22 14:26:55      阅读:217      评论:0      收藏:0      [点我收藏+]

标签:rto   www   eof   load   function   lis   setattr   on()   监听   

 (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‘; //这里是横屏
                                                    //alert("横屏");
                                                    break;
                                                default:
                                                    orientation = ‘portrait‘;//这里是竖屏
                                                    //alert("竖屏");
                                                    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);
                            })();

 

 

 来源:http://www.jb51.net/article/85438.htm

JS检测移动端横竖屏

标签:rto   www   eof   load   function   lis   setattr   on()   监听   

原文地址:http://www.cnblogs.com/cghjy/p/6210471.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!