Question

页面结构：

<body>
<section id="off-right'></section>
<main></main>
</body>

最右边的部分最初是在视图之外翻译出来的，当我左右拖动时，我用HammerJS将其翻译回<main>顶部的页面上，这样可以正常工作。问题是当我触摸屏幕，开始向上或向下滚动，然后不用手指离开时，将其向左移动。这会使整个<main>向左移动。我希望它只是向上/向下滚动。

我正在做的事情：

body and main are both width: 100%, max-width: 100%, overflow-x: hidden

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">

var offset = window.pageXOffset;
    $(window).scroll(function () {
        if(offset != window.pageXOffset)
            window.scrollTo(0, window.pageYOffset);
    });

var options = {
  dragLockToAxis: true,
  dragBlockHorizontal: true
};
var hammertime = new Hammer(element, options);
hammertime.on("dragleft dragright swipeleft swiperight", function(ev){ 
  ev.gesture.preventDefault(); 
  // code for moving #off-right
});

我正在寻找一种维护原生浏览器垂直滚动的解决方案（所以不要使用Hammer dragup / down处理程序来阻止默认（）并设置window.scrollTo，并确定我自己的物理/时间以继续滚动用户可以进行向上/向下滑动。

如何完全阻止在Android Chrome中水平拖动网页？

0 个答案: