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

js 判断手机横竖屏的实现方法（不依赖任何其他库）的更多相关文章

  1. JS判断手机横竖屏

    在移动端开发时,有时候需要判断手机的横竖屏,那么就需要用到window.orientation这个参数,通过这个参数可以判断出手机是处在横屏还是竖屏状态. 屏幕方向对应的window.orientat ...

  2. zepto判断手机横竖屏

    var CheckOrientation = (function(){ var win = $( window ), get_orientation, last_orientation, initia ...

  3. CSS3(@media)判断手机横竖屏

    @media all and (orientation : landscape) { h2{color:red;}/*横屏时字体红色*/ } @media all and (orientation : ...

  4. 手机触屏触摸特效javascript-TouchSwipe（依赖于jquery库）中文说明

    by 郑州seo on 2013 年 7 月 6 日 in jquery, 网站建设 with 6 Comments 最近需要做一个手机小门户网站,因为目前主流的手机都是安卓和苹果的,他们的浏览器内核 ...

  5. js判断手机浏览器是横屏or竖屏

    移动端的浏览器一般都支持window.orientation这个参数,通过这个参数可以判断出手机是处在横屏还是竖屏状态. 从而根据实际需求而执行相应的程序.通过添加监听事件onorientationc ...

  6. H5 手机横竖屏判读

    $.fn.screenCheck = function() { var pDiv = $('<div></div>'); pDiv.addClass("screenC ...

  7. js判断手机浏览器操作系统和微信浏览器的方法

    做手机端的前端开发,少不了对手机平台的判断.如,对于app下载,就要判断在Android平台下就显示Android下载提示:在iOS平台下就显示iOS下载提示. 今天就为大家介绍一下用js判断手机客户 ...

  8. js判断手机 横屏模式

    js判断手机 横屏模式 方法名称:orientation 实例: if(window.orientation!=0){ var obj=document.getElementById('orienta ...

  9. JS判断字符串长度的5个方法

    这篇文章主要介绍了JS判断字符串长度的5个方法,并且区分中文和英文,需要的朋友可以参考下 目的:计算字符串长度(英文占1个字符,中文汉字占2个字符)   方法一:    代码如下: String.pr ...

随机推荐

  1. oracle分析函数系列之sum(col1) over(partition by col2 order by col3):实现分组汇总或递增汇总

    语法:sum(col1) over(partition by col2 order by col3 )  准备数据: DEPT_ID    ENAME          SAL1 1000       ...

  2. docker centos7 配置和宿主机同网段IP

    docker centos7 配置和宿主机同网段IP 1.安装brctl 命令 # yum -y install bridge-utils 2.编辑网卡配置文件 # vi ifcfg-eno16777 ...

  3. PLSQL连接Oracle 报错ORA-12154:TNS:无法解析指定的连接标识符

    原因是图中第三行数据库应该填ip地址,我填了数据库名! 之前不懂原理,现来填坑,并不是应该填ip,而是填tnsname.ora中配置的名字(红框部分) ​

  4. 笔试算法题（10）：深度优先，广度优先以及层序遍历 & 第一个仅出现一次的字符

    出题:要求实现层序遍历二元搜索树,并对比BFS与DFS的区别 分析:层序遍历也就是由上至下,从左到右的遍历每一层的节点,类似于BFS的策略,使用Queue可以实现,BFS不能用递归实现(由于每一层都需 ...

  5. Linux环境下验证码不显示F12报500

     前言: 项目之前部署在linux系统上进行测试,今天重新部署的时候,重启了tomcat然后部署新的版本项目,结果登录页面验证码不显示,在浏览器F12页面显示的是500错误.网上查了很多方法,都没效果 ...

  6. 19Spring返回通知&异常通知&环绕通知

    在前置通知和后置通知的基础上加上返回通知&异常通知&环绕通知 代码: package com.cn.spring.aop.impl; //加减乘除的接口类 public interfa ...

  7. 选项B中：int b[][3]={0,1,2,3}

    选项B中:int b[][3]={0,1,2,3};等价于 int b[][3]={0,1,2,3,0,0};    int b[][3]={0,1,2,3,4};         cout<& ...

  8. java程序调用bat脚本

    运用Java程序控制某个应用程序的运行(以网易云音乐为例),步骤如下 1.建立bat文件分别是start.bat(控制程序的运行)和kill.bat(控制程序的结束): start.bat 的内容如下 ...

  9. 使用GSON解析JSON文件

    package com.pingyijinren.test; /** * Created by Administrator on 2016/5/19 0019. */ public class App ...

  10. [bzoj2738]矩阵乘法_整体二分_树状数组

    矩阵乘法 bzoj-2738 题目大意:给定一个$n*n$的矩阵.每次给定一个矩阵求矩阵$k$小值. 注释:$1\le n\le 500$,$1\le q\le 6\cdot 10^4$. 想法: 新 ...