在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. qt中使用opencv处理图片 QImage 和 IplImage 相互之间转换问题

    在用opencv处理图片显示在qt label上的时候遇到不是问题 1. qt上要用qimage形式才干显示 IplImage转成 Qimage 彩色图像转换 IplImage  *fram; QIm ...

  2. MVC系列之开始

     4月5号晚本来应该写出来的,这几天迷上了炉石传说,打得有点疯,明天又得上班了,收拾心情还是得写出来.上星期5晚上回家的时候,不得不吐槽一下的确有点背.6点下班冲去江夏地铁站,赶7点15分到江门的轻轨 ...

  3. systemTAP 学习

    http://blog.csdn.net/moonvs2010/article/category/1570309

  4. 用sed、awk、grep同时匹配多个条件(与模式、或模式)

    同时匹配ABC 和 123:sed -n '/ABC/{/123/p}' awk '/ABC/&&/123/{ print $0 }' grep -E '(ABC.*123|123.* ...

  5. power desinger 学习笔记<五>

    怎样才能在修改表的字段Name的时候,Code不自动跟着变 tools-> General   Options-> Dialog:Operation   Modes: 去掉 NameToC ...

  6. 远程推送,集成极光的SDK,证书制造

    由于iOS操作系统限制,我们APP在后台不能做操作,也不能接收任何数据,所以需要用推送来接收消息. APNs服务,苹果官方网址:https://developer.apple.com/library/ ...

  7. UIDatePikcer的基本用法

    - (void)viewDidLoad { [super viewDidLoad]; _datePicker = [[UIDatePicker alloc] initWithFrame:CGRectM ...

  8. Nhibernate 智能提示 以及其他类库智能提示

    Nhibernate 的智能提示 Nhibernate.dll 放到以下路径 C:\Program Files (x86)\Reference Assemblies\Microsoft\Framewo ...

  9. hdoj 2049 错排

    代码: #include <stdio.h> int main(){ int n,a,b,i,j; __int64 s[22],h[22]; s[1]=0; s[2]=1; s[3]=2; ...

  10. 292. Nim Game(C++)

    292. Nim Game(C++) You are playing the following Nim Game with your friend: There is a heap of stone ...