zoukankan      html  css  js  c++  java
  • js开启和关闭页面滚动【亲测有效】

    在移动端的页面开发过程中,经常会遇到点击弹框禁止页面滚动的情景,下面就来说下具体的做法。。。

    第一步:构建一个函数

    function bodyScroll(event){
      event.preventDefault();
    }

    第二步:点击禁止页面滚动

    $(".button").click(function(){
        document.body.addEventListener('touchmove',bodyScroll,false);
        $('body').css({'position':'fixed',"width":"100%"});
    });

    第三步:点击开启页面滚动

    $(".shadow-closes").click(function(){
        document.body.removeEventListener('touchmove',bodyScroll,false);
        $("body").css({"position":"initial","height":"auto"});
    });

    完整代码:

    $(".button").click(function(){
        document.body.addEventListener('touchmove',bodyScroll,false);
        $('body').css({'position':'fixed',"width":"100%"});
    });
    $(".shadow-closes").click(function(){
        document.body.removeEventListener('touchmove',bodyScroll,false);
        $("body").css({"position":"initial","height":"auto"});
    });
    function bodyScroll(event){
      event.preventDefault();
    }

  • 相关阅读:
    POJ
    Fence Repair POJ
    COGS 2096. 不平凡的许愿树
    COGS 2095. 不平凡的引线
    BZOJ 4392 卡牌游戏
    COGS 2089. 平凡的测试数据
    Slim Span (最小生成树)
    【BZOJ1294】[SCOI2009]围豆豆Bean 射线法+状压DP+SPFA
    排列perm HYSBZ
    I
  • 原文地址:https://www.cnblogs.com/e0yu/p/11792585.html
Copyright © 2011-2022 走看看