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

代码如下:

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();
});

 

屏幕方向对应的window.orientation值

ipad: 90 或 -90 横屏

ipad: 0 或180 竖屏

Andriod:0 或180 横屏

Andriod: 90 或 -90 竖屏

有次我针对PC版限制了JS缩放的最小尺寸,PC版最小到980像素宽。

但是ipad竖向是属于768以上,要判断要么大于920,要么它是移动设备,于是我查到这个属性,如果该值为真:

if(_maxWidth>920||window.orientation == 90 || window.orientation == -90||window.orientation == 0 || window.orientation == 180){
$("#banner").css({"width": _maxWidth+"px","height":_maxHeight+"px"});
}

效果是正确的。在PC版上屏蔽了图片920像素一下的缩放。ipad正常。

JQuery 判断IPad、IPhone、Android是横屏还是竖屏(Window.Orientation实现)的更多相关文章

  1. 基于jQuery的判断iPad、iPhone、Android是横屏还是竖屏的代码

    在ipad.iphone网页开发中,我们很可能需要判断是横屏或者竖屏.下面就来介绍如何用 jQuery 判断iPad.iPhone.Android是横屏还是竖屏的方法 其实主要是通过window.or ...

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

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

  3. Android 设置横屏或竖屏

    方法一:在AndroidManifest.xml中配置 如果不想让软件在横竖屏之间切换,最简单的办法就是在项目的AndroidManifest.xml中找到你所指定的activity中加上androi ...

  4. android界面横屏和竖屏的切换

    关于android横屏和竖屏的切换网上给了很多种.但是有些介绍的方法都是在android旧版本上. 我现在把握用到的情况写下来用于备忘: android 版本:4.0 - 4.4 要求:android ...

  5. android设置横屏和竖屏的方法

    方法一:在AndroidManifest.xml中配置 假设不想让软件在横竖屏之间切换,最简单的办法就是在项目的AndroidManifest.xml中找到你所指定的activity中加上androi ...

  6. 基于jQuery的判断iPad、iPhone、Android是横屏还是竖屏

    function orient() {if (window.orientation == 90 || window.orientation == -90) {//ipad.iphone竖屏:Andri ...

  7. 如何切换android的横屏与竖屏?

    选中需要切换的模拟器,按住CTRL+F11或者CTRL+F12即可进行切换.

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

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

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

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

随机推荐

  1. C程序内存管理

    C程序的内存管理 熟悉Java语言的肯定知道,Java中内存管理是由虚拟机帮助我们完毕的,在C/C++中可不是这样,程序猿须要自己去分配和回收内存空间.本文记录了C程序可运行文件的存储结构.在内存中的 ...

  2. 【BZOJ1833】【ZJOI2010】数字计数 数位DP

    链接: #include <stdio.h> int main() { puts("转载请注明出处[辗转山河弋流歌 by 空灰冰魂]谢谢"); puts("网 ...

  3. spring session工程发布--一种新的管理httpsession的方法

    官方文档:http://spring.io/blog/2014/07/08/spring-session-1-0-0-m1-released 1. 优点: This project provides ...

  4. [转] Immutable 详解及 React 中实践

    https://zhuanlan.zhihu.com/p/20295971 作者:camsong链接:https://zhuanlan.zhihu.com/p/20295971来源:知乎著作权归作者所 ...

  5. ssh连接超时问题解决方案

    方法一: 1.设置服务器向SSH客户端连接会话发送频率和时间 #vi /etc/ssh/sshd_config,添加如下两行ClientAliveInterval 60ClientAliveCount ...

  6. Quartz.NET管理类

    最近做项目设计到Quartz.NET,写了一个Quartz.NET管理类,在此记录下. public class QuartzManager<T> where T : class,IJob ...

  7. jquery生成UUID的方法

    来源:  http://www.broofa.com/2008/09/javascript-uuid-function/ 1.代码:  http://www.broofa.com/Tools/Math ...

  8. C#中区别多态、重载、重写的概念和语法结构

    C#中区别多态.重载.重写的概念和语法结构 重写是指重写基类的方法,在基类中的方法必须有修饰符virtual,而在子类的方法中必须指明override. 格式: 基类中: public virtual ...

  9. IIS 64位上發佈32位asp.net設置

    錯誤:無法載入檔案或組件 'Maticsoft.Web' 或其相依性的其中之一. 試圖載入格式錯誤的程式. 解決:新增應用程序池——高級設置——啟用32位應用程式——True

  10. 【转】 ios开发之倒计时实现的两种方法

    原文:http://blog.csdn.net/kylinbl/article/details/8972261 方法1:使用NSTimer来实现 主要使用的是NSTimer的scheduledTime ...