H5网页判断手机横屏或是竖屏
我们做出来的H5页面在手机端浏览的时候,用户很有可能会产生更换横竖屏的操作,这时如果我们能够判断出横竖屏,就可以更好的优化我们的网页,进而拥有更好的用户体验度。下面是判断横竖屏的代码:
window.addEventListener('orientationchange', function(event){
if ( window.orientation == 180 || window.orientation==0 ) {
alert("竖屏");
}
if( window.orientation == 90 || window.orientation == -90 ) {
alert("横屏");
}
});
大家可以拿到手机上去试一下
H5网页判断手机横屏或是竖屏的更多相关文章
- js判断是横屏还是竖屏
1通过在html中分别引用横屏和竖屏的样式: <link rel="stylesheet" media="all and (orientation:portrait ...
- android 强制设置横屏 判断是横屏还是竖屏
判断activity 是横屏还是竖屏 方法 1: //根据设备配置信息 Configuration cf= this.getResources().getConfiguration(); //获取设 ...
- Android开发11——手机横屏和竖屏与android:configChanges
目前大多数手机都支持重力感应随之而来的就是屏幕方向改变的问题.对应普通开发者来说屏幕的随意改变也会带来困扰.在Google自带的doc里可以看到,如果设备的配置(Resources.Configura ...
- js判断手机浏览器是横屏or竖屏
移动端的浏览器一般都支持window.orientation这个参数,通过这个参数可以判断出手机是处在横屏还是竖屏状态. 从而根据实际需求而执行相应的程序.通过添加监听事件onorientationc ...
- 使用JavaScript判断手机是处于横屏还是竖屏
移动端的浏览器一般都支持window.orientation这个参数,通过这个参数可以判断出手机是处在横屏还是竖屏状态.从而根据实际需求而执行相应的程序.通过添加监听事件onorientationch ...
- JQuery 判断IPad、IPhone、Android是横屏还是竖屏(Window.Orientation实现)
在ipad.iphone网页开发中,我们很可能需要判断是横屏或者竖屏.下面就来介绍如何用 jQuery 判断iPad.iPhone.Android是横屏还是竖屏的方法. 代码如下: function ...
- 基于jQuery的判断iPad、iPhone、Android是横屏还是竖屏的代码
在ipad.iphone网页开发中,我们很可能需要判断是横屏或者竖屏.下面就来介绍如何用 jQuery 判断iPad.iPhone.Android是横屏还是竖屏的方法 其实主要是通过window.or ...
- CSS3判断手机横屏竖屏
原理: 当用户旋转屏幕的时候,会进入到你的监听方法中,然后通过window.orientation来获取当前屏幕的状态:0 - 竖屏90 - 逆时针旋转横屏-90 - 顺时针旋转横屏180 - 竖屏, ...
- [JS代码]如何判断ipad或者iphone是否为横屏或者竖屏 - portrait或者landscape
//判断横屏或者竖屏 function orient() { //alert('gete'); if (window.orientation == 0 || window.orientation == ...
随机推荐
- [HNOI2012]矿场搭建(tarjan求点双)
题目 Description 煤矿工地可以看成是由隧道连接挖煤点组成的无向图.为安全起见,希望在工地发生事故时所有挖煤点的工人都能有一条出路逃到救援出口处.于是矿主决定在某些挖煤点设立救援出口,使得无 ...
- 一个简单的NoSQL内存数据库—Berkeley DB基本操作的例子
一个简单的NoSQL内存数据库—Berkeley DB基本操作的例子 最近,由于云计算的发展,数据库技术也从结构式数据库发展到NoSQL数据库,存储模式从结构化的关系存储到现在如火如荼的key/val ...
- C#图解教程学习笔记——事件
一.事件的定义事件:当一个特定的程序事件发生时,程序的其他部分可以得到该事件已经发生的通知,同时运行相应处理程序.事件的很多部分都与委托类似.实际上,事件就像专门用于特殊用途的简单委托.事件包含了一个 ...
- springBoot yml 和 properties
加载顺序不一致,application.yml 在前,application.properties 在后. yml 文件内容 server: port: 8081 spring: redis: dat ...
- 使用UICollectionView遇到的各种坑
1)头视图和尾部视图的添加 UICollectionReusableView *headerView = [collectionView dequeueReusableSupplementaryVie ...
- Mysql varchar长度问题
http://dinglin.iteye.com/blog/914276 http://www.cnblogs.com/fakis/archive/2011/03/07/1976532.html ...
- ActiveMQ 使用spring模板 发布消息过程分析
convertAndSend()方法中获得dstination,即发送信息的目的地dstination可以在spring的配置文件中指定自定义的,在JmsTemplate类中,pubSubDomain ...
- mac 安装 word2016并破解
http://blog.csdn.net/zqbx7/article/details/53448280
- 解决Ubuntu下gedit中文乱码的情况
windows下简体中文多用GBK编码 (或GB2312, GB18030), 而linux下多用UTF-8编码. 因此,一般来说在微软平台编辑的中文txt不能在ubuntu下直接打开查看,除非在保存 ...
- VS2010 MFC中 窗口分割的实现
分割窗口概述 分割窗口,顾名思义,就是将一个窗口分割成多个窗格,在每个窗格中都包含有视图,或者是同一类型的视图,或者是不同类型的视图. MFC分割窗口的方式有两种,动态分割和静态分割. 动态分割窗口通 ...