zoukankan      html  css  js  c++  java
  • js 判断手机横竖屏的实现方法(不依赖任何其他库)

    <!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/

  • 相关阅读:
    Oracle存储过程格式
    Parallel并行运算实例
    唐让的领航少年
    株洲县阳光三农网
    株洲县招商网
    利用css新属性appearance优化select下拉框
    谈谈我的出差感想
    颜色表及html代码
    jquery中DOM的操作方法
    HTML DOM的nodeName,nodeValue,nodeType介绍
  • 原文地址:https://www.cnblogs.com/tangbuluo/p/11248820.html
Copyright © 2011-2022 走看看