• 手机端禁止浏览器左右滑动


    在手机端vue项目中,禁止页面左右滑动,代码直接写在index.html中

    var startPos = 0,endPos = 0,isScrolling = 0;
    document.addEventListener('touchstart',function(event){
    var touch = event.targetTouches[0]; //touches数组对象获得屏幕上所有的touch,取第一个touch
    startPos = {x:touch.pageX,y:touch.pageY,time:+new Date}; //取第一个touch的坐标值
    isScrolling = 0; //这个参数判断是垂直滚动还是水平滚动
    }, false);

    //解绑事件 web前端开发
    document.addEventListener('touchend',function(event){
    document.removeEventListener('touchmove',this,false);
    document.removeEventListener('touchend',this,false);
    }, false);

    document.addEventListener('touchmove',function(event){
    //当屏幕有多个touch或者页面被缩放过,就不执行move操作
    if(event.targetTouches.length > 1 || event.scale && event.scale !== 1) return;
    var touch = event.targetTouches[0];
    endPos = {x:touch.pageX - startPos.x,y:touch.pageY - startPos.y};
    isScrolling = Math.abs(endPos.x) < Math.abs(endPos.y) ? 1:0; //isScrolling为1时,表示纵向滑动,0为横向滑动
    if(isScrolling === 0){
    // alert(0);
    event.preventDefault(); //阻止触摸事件的默认行为,即阻止滚屏
    }
    }, false);

    保证上下可以滑动

  • 相关阅读:
    thrift python安装
    第二周习题F
    Equivalent Strings
    生成可重集的排列(方法)
    分数拆分(刘汝佳紫书P183)
    Prime ring problem
    Maximun product
    Division
    每周一赛(E题,广搜求方案)
    ICE CAVE(BFS搜索(模拟))
  • 原文地址:https://www.cnblogs.com/rrene/p/9226323.html
Copyright © 2020-2023  润新知