<!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. python 调用exe程序

    #!/usr/bin/python #-*- coding:utf-8 -*- import os, subprocess import tkMessageBox import msg_box def ...

  2. SpringBoot Banner 图片定制修改

    启动Spring Boot项目的时候,在控制台会默认输出一个启动图案 这个图案如果你需要的话是可以自己修改的,修改方式很简单: 1. 在src/main/resources下新建一个banner.tx ...

  3. assert.throws()函数详解

    assert.throws(block[, error][, message]) Node.js FS模块方法速查 期望 block 函数抛出一个错误. 如果指定 error,它可以是一个构造函数.正 ...

  4. MT4系统自带指标代码

    MT4系统自带指标代码 ~ Accelerator Oscillator 震荡加速指标:                   double iAC() ~ Accumulation/Distribut ...

  5. STM32——GPIO口的八种工作模式

    GPIO的输入工作模式1——输入浮空模式: GPIO_Mode_IN_FLOATING =0x04 工作原理:配置完相应寄存器为此工作模式后,高低电平信号通过1处的IO口输入进去,由于寄存器配置了的缘 ...

  6. 2018/08/23 cstring中memset()函数的运用

    好多东西其实以前已经查过了,然后当时理解的还行,可是过段时间没用有些又会忘记,然后又去找资料又查,浪费了不少的时间和精力,所以,我,曾国强,今天起,要好好做笔记了! 今天复习第一个知识点,为什么要叫复 ...

  7. RS232

    RS232的最大的传输速率大约10KBytes/s. 全双工工作方式,异步.数据是8位作为一块来发送的,先发送最低位,最后发送最高位. 在232通信中: Both side of the cable ...

  8. Wireshark抓包工具的简单使用1（界面介绍）

    Wireshark安装完成后,就可以打开,具体运行界面如下 一.菜单——用于开始操作 File ——包括打开.合并捕捉文件,save/保存,Print/打印,Export/导出捕捉文件的全部或部分.以 ...

  9. [luoguP2617] Dynamic Ranking（树状数组 套 主席树 + 离散化）

    传送门 BZOJ上是权限题,洛谷赞啊. 求区间 K 大数很简单. 但是如果修改某个数的话,那么就得把这个数及后面所建的主席树都更新一遍 nlogn,显然不行. 所以可以在外面套一个树状数组来优化,树状 ...

  10. [codevs4655] 序列终结者（Splay）

    传送门 支持操作: 1.区间加 2.区间翻转 3.区间求最大值 splay模板 注意:update 里更新 max 时需要取 3 个值的 Max 别忘了各种边界讨论 ——代码 #include < ...