在一些移动端页面中,页面的样式我们就支持竖屏播放,这时我们就需要判断是横屏还是竖屏了,不同的方向显示冉的样式。


//判断手机横屏竖屏
var html = "";
window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", function() {
if(window.orientation === 180 || window.orientation === 0) {
alert('竖屏状态!');
var ele = document.getElementsByClassName("henping")[0];
ele.style.display = "none"; }
if(window.orientation === 90 || window.orientation === -90) {
alert('横屏状态!');
var ele = document.createElement("div");
ele.setAttribute("class", "henping");
var tet = document.createTextNode("请使用竖屏浏览");
ele.appendChild(tet);
ele.addEventListener("touchstart", cancle);
ele.addEventListener("touchmove", cancle);
document.body.appendChild(ele)
function cancle(e) {
e.preventDefault();
}
}
}, false);

 

js-判断移动端用户是横屏放的还是竖屏放的的更多相关文章

  1. js 判断pc端或手机端

    <script> (function () { var navUA = navigator.userAgent; var defIncludeStr = "iPhone|Andr ...

  2. js判断移动端是否安装某款app的多种方法

    本文实例讲解了js判断移动端是否安装某款app的多种方法,分享给大家供大家参考,具体内容如下 第一种方法: 一:判断是那种设备 ? || u.indexOf(; //android终端或者uc浏览器 ...

  3. JS 判断移动端与PC端

    js判断移动端与pc端   这里介绍下使用device.js插件来判断移动端设备 地址:https://github.com/matthewhudson/device.js 示例: 1 2 3 4 5 ...

  4. JS判断移动端还是PC端(改造自腾讯网) 仅用于宣传动画,下载页等

    JS判断移动端还是PC端(改造自腾讯网 http://www.qq.com/) 本脚本仅用于宣传动画,下载页( ipad 也算pc端)等,  ionic 用 ionic.platform 即可( io ...

  5. android 国际化 横屏(land) 竖屏(port)margin外边距和padding内边距

    android 国际化 横屏(land) 竖屏(port) 边距又分为内边距和外边距,即margin和padding.

  6. JS判断登陆端是PC还是手机

    前些天朋友问我怎么判断登陆端是PC还是手机...自己也是很困惑,然后自己查了资料,这些东西都藏在USER-AGENT里面,查了他的一些属性,写了一个简单的验证页面大家共同学习. 读取navigator ...

  7. JS判断移动端访问设备并加载对应CSS样式

    JS判断不同web访问环境,主要针对移动设备,提供相对应的解析方案(判断设备代码直接copy腾讯网的) // 判断是否为移动端运行环境 if(/AppleWebKit.*Mobile/i.test(n ...

  8. js判断移动端和PC端跳转不同页面

    方法一: /* * * 判断PC端与WAP端 */ var mobile_bs = { versions: function() { var u = navigator.userAgent; retu ...

  9. js判断PC端与移动端跳转

    在网上看到很多这样类似的代码,但是有的很复杂,或者有的没有判断完全,上次经理去见完客户回来讲,使用苹果浏览打开pc端(pc已经做了识别跳转)会自动跳转到移动端的网页去,后来经测试才发现 documen ...

随机推荐

  1. 购物车小程序(while循环,列表)

    while True: salary = input("please input your salary:") if salary.isdigit(): salary=int (s ...

  2. python数据类型之字典(dict)和其常用方法

    字典的特征: key-value结构key必须可hash,且必须为不可变数据类型.必须唯一. # hash值都是数字,可以用类似于2分法(但比2分法厉害的多的方法)找.可存放任意多个值.可修改.可以不 ...

  3. org.apache.catalina.webresources.Cache.backgroundProcess The background cache eviction process was unable to free [10] percent of the cache for Context [/filestore] - consider increasing the maximum s

    需要耐心啊,太急于求成,希望直接就得到解决方法了...以至于正确方法都已经出现了,我却没有耐心看下去,所以反而又耽误了不少时间.... 项目加载100+张图片,还有一个小的MP4,所以console警 ...

  4. 关于sizeof,对空指针sizeof(*p)可以吗?

    C/C++的sizeof在动态分配内存时经常用到,但之前一直没怎么关注它的具体机制.今天在为一个复杂声明的指针分配内存时,想起来要了解一下sizeof到底是什么? 先抛个问题: 程序运行过程中对空指针 ...

  5. 制作iso文件

     genisoimage -o fusionstor-yi-2017-03-08.iso(镜像名称) -v -cache-inodes -joliet-long -R -J -T -V ZS  -c  ...

  6. 为工程添加上下文菜单(ContextMenu)

    上下文菜单大多数情况下都是为ListView中的Item添加的,长按2S左右跳出菜单,添加上下文菜单必须重写活动中的onCreateContextMenu()方法和onContextItemSelec ...

  7. luogu1251 餐巾计划问题

    ss是源点,代表餐巾卖家,tt是汇点,代表记账收钱者. 记p(i)是i天早晨的可用毛巾数,q(i)是i天完了的废毛巾数. 建图见注释 #include <iostream> #includ ...

  8. AngularJS自定义指令directive:scope属性 (转载)

    原文地址:http://blog.csdn.net/VitaLemon__/article/details/52213103 一.介绍: 在AngularJS中,除了内置指令如ng-click等,我们 ...

  9. RIP 路由协议

    RIP动态路由选择协议 routing information protocol     IGP   小范围   路由器限制为15台  超过可能无法收敛   收敛概念  在一个域内  各个路由器知道各 ...

  10. NVIDIA NVML Driver/library version mismatch

    sudo rmmod nvidia_drm sudo rmmod nvidia_modeset sudo rmmod nvidia_uvm sudo lsof /dev/nvidia* confirm ...