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

//判断手机横竖屏状态: function hengshuping(){ if(window.orientation==180||window.orientation==0){ alert("竖屏状态!") } if(window.orientation==90||window.orientation==-90){ alert("横屏状态!") } } window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", hengshuping, false);
function orient() { if (window.orientation == 90 || window.orientation == -90) { //ipad、iphone竖屏;Andriod横屏 $("body").attr("class", "landscape"); orientation = 'landscape'; return false; } else if (window.orientation == 0 || window.orientation == 180) { //ipad、iphone横屏;Andriod竖屏 $("body").attr("class", "portrait"); orientation = 'portrait'; return false; } } //页面加载时调用 $(function(){ orient(); }); //用户变化屏幕方向时调用 $(window).bind( 'orientationchange', function(e){ orient(); });

在ipad、iphone网页开发中,我们很 可能需要判断是横屏或者竖屏。 下面介绍如何用 jQuery 判断iPad、iPhone、Android是横屏还是竖屏的方法

屏幕方向对应的window.orientation值: ipad: 90 或 -90 横屏 ipad: 0 或180 竖屏 Andriod:0 或180 横屏 Andriod: 90 或 -90 竖屏

js判断手机浏览器是横屏or竖屏的更多相关文章

  1. 使用JavaScript判断手机是处于横屏还是竖屏

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

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

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

  3. Android 判断当前屏幕是横屏还是竖屏

       记录学习 /**  * 返回当前屏幕是否为竖屏.  * @param context  * @return 当且仅当当前屏幕为竖屏时返回true,否则返回false.  */  public s ...

  4. JS判断手机浏览器

    <script type="text/javascript"> /* * 智能机浏览器版本信息: * */ varbrowser={ versions:function ...

  5. js判断手机浏览器并跳转到手机网站

    function uaredirect(murl){ try { if(document.getElementById("bdmark") != null){ return; } ...

  6. JS判断手机浏览器内核

    function is_weixn_qq() { var ua = navigator.userAgent.toLowerCase(); if (ua.match(/MicroMessenger/i) ...

  7. JS判断手机横竖屏

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

  8. js判断手机 横屏模式

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

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

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

随机推荐

  1. Ajax的基本使用

    AJAX AJAX即"Asynchronous Javascript And XML"(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术. AJAX = ...

  2. python+selenium简易自动化框架,包含生成测试报告以及发送结果至Email

    Selenium+python环境搭建见虫师的pdf文档,非常详尽 简易框架: 1.文件目录:

  3. 02.Sencha ExtJS 6 - What is Viewport?

    什么是Viewport? Viewport (Ext.container.Viewport)是一个专门的容器用于可视应用领域(浏览器窗口).Viewport渲染自身到网页的documet body区域 ...

  4. unity 3d孤岛求生案例代码解析

    这是第一人称控制器脚本,如果把摄像机放在胶囊体后面感觉就是第三人称了啊. #pragma strict var speed : float = 6.0; var jumpspeed: float = ...

  5. 第二章Java基础之标识符

  6. copy(python中的引用,浅拷贝,深拷贝)

    #直接赋值 list = [1,2,['a','b'],'python'] #现将a等于list a = list print a [1,2,['a','b'],'python'] list.appe ...

  7. CSS z-index 属性

    定义和用法 z-index 属性设置元素的堆叠顺序.拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面. 注释:元素可拥有负的 z-index 属性值. 注释:Z-index 仅能在定位元素上奏 ...

  8. JS正则表达式验证账号、手机号、电话和邮箱

    JS正则表达式验证账号.手机号.电话和邮箱 效果体验:http://keleyi.com/keleyi/phtml/jstexiao/15.htm 验证帐号是否合法 验证规则:字母.数字.下划线组成, ...

  9. 转载:Solr的自动完成实现方式(第二部分:Suggester方式)

    转自:http://www.cnblogs.com/ibook360/archive/2011/11/30/2269077.html 在Solr的自动完成/自动补充实现介绍(第一部分) 中我介绍了怎么 ...

  10. mac升级后提示pod: command not found

    问题:升级mac到10.12使用pod,提示pod: command not found   解决方法:sudo gem install -n /usr/local/bin cocoapods   如 ...