1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="application/xhtml+xml;charset=UTF-8" />
  5. <meta name="viewport" content="width=device-width" />
  6. <title>手机横、竖屏事件</title>
  7. <script language="javascript" type="text/javascript">
  8. //屏幕方向标识，0横屏，其他值竖屏
  9. var orientation=0;
  10. //转屏事件，内部功能可以自定义
  11. function screenOrientationEvent(){
  12.     if(orientation == 0)document.getElementById("change").value="竖";
  13.     else document.getElementById("change").value="横";
  14. }
  15. var innerWidthTmp = window.innerWidth;
  16. //横竖屏事件监听方法
  17. function screenOrientationListener(){
  18.     try{
  19.         var iw = window.innerWidth;
  20.         //屏幕方向改变处理
  21.         if(iw != innerWidthTmp){
  22.             if(iw>window.innerHeight)orientation = 90;
  23.             else orientation = 0;
  24.             //调用转屏事件
  25.             screenOrientationEvent();
  26.             innerWidthTmp = iw;
  27.         }
  28.     } catch(e){alert(e);};
  29.     //间隔固定事件检查是否转屏，默认500毫秒
  30.     setTimeout("screenOrientationListener()",500);
  31. }
  32. //启动横竖屏事件监听
  33. screenOrientationListener();
  34. </script>
  35. </head>
  36. <body onload="screenOrientationEvent()">
  37. <input id="change" type="text" value=""/>
  38. </body>
  39. </html>

原文地址

http://www.dewen.io/q/8694/js%E5%A6%82%E4%BD%95%E8%AE%BE%E7%BD%AE%E7%BD%91%E9%A1%B5%E6%A8%AA%E5%B1%8F%E5%92%8C%E7%AB%96%E5%B1%8F%E5%88%87%E6%8D%A2

js如何设置网页横屏和竖屏切换的更多相关文章

  1. 转载-js如何设置网页横屏和竖屏切换

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  2. sencha touch 在安卓中横屏、竖屏切换 应用崩溃问题

    答案来至于 Sencha Touch 交流 @周旭 这是由于横竖屏转换导致activity重跑onCreate方法导致的,有两种解决方案:1.横竖屏转换的时候不要重新跑onCreate方法,这个可以在 ...

  3. android 强制设置横屏 判断是横屏还是竖屏

    判断activity 是横屏还是竖屏  方法 1: //根据设备配置信息 Configuration cf= this.getResources().getConfiguration(); //获取设 ...

  4. 【转】Android 模拟器横屏竖屏切换设置

    http://blog.csdn.net/zanfeng/article/details/18355305# Android 模拟器横屏竖屏切换设置时间:2012-07-04   来源:设计与开发   ...

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

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

  6. activity的横屏和竖屏设置

    主要在清单文件这样配置: <application android:allowBackup="true" android:icon="@drawable/ic_la ...

  7. js判断是横屏还是竖屏

    1通过在html中分别引用横屏和竖屏的样式: <link rel="stylesheet" media="all and (orientation:portrait ...

  8. [JS代码]如何判断ipad或者iphone是否为横屏或者竖屏 - portrait或者landscape

    //判断横屏或者竖屏 function orient() { //alert('gete'); if (window.orientation == 0 || window.orientation == ...

  9. 查看，设置，设备的 竖屏-横屏模式 screen.orientation

    <body> <div id="doc"></div> <div id="model"></div> ...

随机推荐

  1. Linq/EF/lambda Group by/Order by 多个字段详细用法

    1)单个字段Group by: //a.Key类型与a.Province字段类型一样  .GroupBy(a => a.Province).Select(a => a.Key).ToLis ...

  2. MySQL查询优化:连接查询排序limit

    MySQL查询优化:连接查询排序limit(join.order by.limit语句) 2013-02-27      个评论       收藏    我要投稿   MySQL查询优化:连接查询排序 ...

  3. 发送邮件（E-mail）方法整理合集

    在IOS开发中,有时候我们会需要用到邮件发送的功能.比如,接收用户反馈和程序崩溃通知等等.其实这个功能是很常用的,因为我目前就有发送邮件的开发需求,所以顺便整理下IOS发送邮件的方法. IOS原生自带 ...

  4. 转:理解 PHP 中的 Streams

    本文转自:开源中国社区 [http://www.oschina.net]本文标题:理解 PHP 中的 Streams 本文地址:http://www.oschina.net/translate/und ...

  5. 开发人员应关注的20个jQuery网站/博客

    http://blog.jobbole.com/1466/ 2.  10个优秀的移动Web应用开发框架 http://blog.jobbole.com/1436/ 3.  介绍jQ Mobile ht ...

  6. 最新game

    #include <stdio.h> #include <stdlib.h> #include <string.h> #include <signal.h&g ...

  7. BZOJ 3243 向量内积

    Description 两个\(d\)维向量\(A=[a_{1},a_{2},...,a_{d}]\)与\(B=[b_{1},b_{2},...,b_{d}]\)的内积为其相对应维度的权值的乘积和,即 ...

  8. Pearls DP

    Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 6647   Accepted: 3241 Description In Pe ...

  9. COJ 0046 20701除法

    20701除法 难度级别:B: 运行时间限制:1000ms: 运行空间限制:51200KB: 代码长度限制:2000000B 试题描述     输入正整数n,按从小到大的顺序输出所有满足表达式abcd ...

  10. 数学（错排）：BZOJ 4517: [Sdoi2016]排列计数

    4517: [Sdoi2016]排列计数 Time Limit: 60 Sec  Memory Limit: 128 MBSubmit: 693  Solved: 434[Submit][Status ...