文章/答案/技术大牛

发布

社区首页 >问答首页 >触摸板上的两指滚动js

问触摸板上的两指滚动js
EN

Stack Overflow用户

提问于 2012-04-02 21:59:45

回答 3查看 8.6K关注 0票数 5

我们已经开发了一个网站，其中with具有水平方向，并希望实现触摸板控制与两个手指左右移动。

当您在触摸板上向左/向右移动两个手指时，网站页面将向左/向右滚动。现在我们已经实现了触摸板控制，两个手指向上/向下移动和页面左右滚动。

如何使用js或jQuery将触摸板控件从上/下移动到左/右，以向左/右滚动站点页面？

javascript

jquery

touchpad

回答 3

Stack Overflow用户

发布于 2017-06-12 22:49:53

我可能有点晚了，但在我偶然发现这个问题之前，我也有同样的问题。进一步的调查让我认为捕捉触控板滚动的最好方法是wheel事件。

function doScroll(e) {
    // positive deltas are top and left
    // down and right are negative

    // horizontal offset    e.deltaX
    // vertical offset      e.deltaY

    console.log(`x:${e.deltaX} y:${e.deltaY}`);

    e.preventDefault(); // disable the actual scrolling
}

window.addEventListener("wheel", doScroll, false);

我已经准备好了a fiddle，它告诉你滚动方向和偏移值，但阻止滚动本身。

wheel event有一个增量属性，它(至少在Chrome中)对动量敏感，它会给出当前的相对滚动偏移量，而不是scroll事件中可用的绝对滚动位置。

票数 8

Stack Overflow用户

发布于 2012-04-02 23:19:11

通常，当你想要接管脚本中的触摸事件时，你可以添加一些类似这样的东西来防止通常的滚动和缩放：

$("body").bind("touchstart", function(e) {
    e.preventDefault();
})

票数 0

Stack Overflow用户

发布于 2012-04-02 23:09:44

您需要做的是更改可以滚动的内容。如果您的页面足够大，在向左/向右滚动有意义的地方，浏览器将允许以这种方式滚动。

基本上，如果你只想让它们在某个方向上滚动，那就只在那个方向上做内容。如有必要，您可以通过将overflow设置为none来获得所需的特定大小的容器div。

票数 -1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/9977876

复制

相似问题

问触摸板上的两指滚动js
EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问触摸板上的两指滚动jsEN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问触摸板上的两指滚动js
EN