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

更新时间：2014年05月11日 12:24:41 作者：

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

其实主要是通过window.orientation实现，下面看下代码吧

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 竖屏

您可能感兴趣的文章:

jquery插件jSignature实现手动签名
在IE7~IE8这种不支持HTML5的浏览器上，是利用Flash嵌入的方式实现的签名处理，在支持的HTML5的浏览器上默认采用canvas标签处理签名，可以生成 PNG格式、SVG格式的签名图片。非常适合在IPAD等移动客户端上实现手写签名的，该插件基于JQuery
2015-05-05
jQuery.each使用详解
这篇文章主要给大家详细介绍了jQuery.each使用方法及源码分析的相关资料,需要的朋友可以参考下
2015-07-07
jQuery实现动态显示select下拉列表数据的方法
这篇文章主要介绍了jQuery实现动态显示select下拉列表数据的方法,涉及jQuery针对json数据的读取、遍历及页面元素属性动态操作相关实现技巧,需要的朋友可以参考下
2018-02-02
jq实现左滑显示删除按钮,点击删除实现删除数据功能(推荐)
下面小编就为大家带来一篇jq实现左滑显示删除按钮,点击删除实现删除数据功能(推荐)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-08-08
解决jquery的.animate()函数在IE6下的问题
最近刚在项目里面花心思捉摸JQ，所以有些心得也及时放上来，理解不足的地方也请教下大家。
2010-12-12
jquery 表单验证之通过 class验证表单不为空
在开发系统时，往往都有某些表单数据为必填项，若用jQuery通过ID去验证，不仅会影响效率，还会有所遗漏，不易于后期维护。本章将介绍如何利用jQuery，通过为表单配置class进行统一验证。
2015-11-11
jquery通过load获取文件的内容并跳到锚点的方法
这篇文章主要介绍了jquery通过load获取文件的内容并跳到锚点的方法,涉及load及animate等方法的使用技巧,需要的朋友可以参考下
2015-01-01
浅谈jQuery中hide和fadeOut的区别 show和fadeIn的区别
下面小编就为大家带来一篇浅谈jQuery中hide和fadeOut的区别 show和fadeIn的区别。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-08-08
Jquery 选中表格一列并对表格排序实现原理
该实现的主要思想是：获取鼠标点击的表头单元格的列号，遍历数据行，获取每个<tr>中的html，同时获取每个<tr>标签下对应获取到的列号的<td>标签中的内容，并取得<th>标签的type属性值，需要的朋友可以了解下
2012-12-12
jQuery实现可拖拽3D万花筒旋转特效
本文主要介绍了使用了CSS3立体效果的强大特效，本特效使用jQuery跟CSS3 transform来实现在用户鼠标按下拖动时，环形图片墙可以跟随鼠标进行3D旋转动画。下面跟着小编一起来看下吧
2017-01-01