欢迎来到代码驿站!

JavaScript代码

当前位置:首页 > 网页前端 > JavaScript代码

js判断横竖屏及禁止浏览器滑动条示例

时间:2020-12-05 12:15:00|栏目:JavaScript代码|点击:
复制代码 代码如下:

var $horizontal = $('.horizontal_screen') ; //可自定义横屏模式提示样式
var $document = $(document) ;
var preventDefault = function(e) {
e.preventDefault();
};
var touchstart = function(e) {
$document.on('touchstart touchmove', preventDefault);
};
var touchend = function(e) {
$document.off('touchstart touchmove', preventDefault);
};

function listener(type){
if('add' == type){
//竖屏模式
$horizontal.addClass('hide');
$document.off('touchstart', touchstart);
$document.off('touchend', touchend);
}else{
//横屏模式
$horizontal.removeClass('hide');
$document.on('touchstart', touchstart);
$document.on('touchend', touchend);
}
}
function orientationChange(){
switch(window.orientation) {
//竖屏模式
case 0:
case 180:
listener('add');
break;
//横屏模式
case -90:
case 90:
listener('remove');
break;
}
}

$(window).on("onorientationchange" in window ? "orientationchange" : "resize", orientationChange);

$document.ready(function(){
//以横屏模式进入界面,提示只支持竖屏
if(window.orientation == 90 || window.orientation == -90){
listener('remove');
}
});

上一篇:复杂的javascript窗口分帧解析

栏    目:JavaScript代码

下一篇:js清理Word格式示例代码

本文标题:js判断横竖屏及禁止浏览器滑动条示例

本文地址:http://www.codeinn.net/misctech/29587.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有