码迷,mamicode.com
首页 > 移动开发 > 详细

【移动端】js禁止页面滑动与允许滑动

时间:2018-06-21 22:38:09      阅读:416      评论:0      收藏:0      [点我收藏+]

标签:tde   chm   rev   eve   function   click   efault   stop   nbsp   

禁止页面滑动

通常静止滑动方案:(阻止滑动事件)

window.ontouchmove=function(e){
    e.preventDefault && e.preventDefault();
    e.returnValue=false;
    e.stopPropagation && e.stopPropagation();
    return false;
};

有部分机型不支持以上静止滑动方案,可使用:(点击后页面浮动到指定位置不动 将body的position设置为fixed)

$("#btn").click(function(){
    var top=$(window).scrollTop();//这是当前滚动的页面滚动条位置
    $("body").css({
        "position":"fixed",
        "width":"100%",
        "top":top*-1 //此处为当前需要定住的位置
    });
});

允许页面滑动:

通常允许滑动方案:(清空滑动事件即可)

window.ontouchmove="";

处理部分机型禁止滑动的允许滑动:(将body的position设置为static)

$("#btn2").click(function(){
    $("body").css({
        "position":"static"
    });
});

 

【移动端】js禁止页面滑动与允许滑动

标签:tde   chm   rev   eve   function   click   efault   stop   nbsp   

原文地址:https://www.cnblogs.com/wuhairui/p/9211007.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!