处理触控板惯性滚动javascript



我正在创建一个全页面网站,并使用fullPageScrollPureJs作为插件滚动到各个部分。使用鼠标滚轮和键盘可以很好地工作,但使用触控板可以一次滚动多页。有没有办法用触控板处理滚动并防止多页滚动?非常感谢。

<link rel="stylesheet" href="https://rawgit.com/almeida-matheus/fullPageScrollPureJS/master/app/assets/stylesheet/full-page-scroll.css">
<body>
<div id="main" class="scroll-container">
<section style="background-color:blue"></section>
<section style="background-color:red"></section>
<section style="background-color:green"></section>
<section style="background-color:blue"></section>
</div>

<!-- Scripts section -->
<script src="https://rawgit.com/almeida-matheus/fullPageScrollPureJS/master/app/assets/javascript/full-page-scroll.js"></script>
<script>
//Init FullScroll Plugin
new fullScroll({
mainElement: "main",
displayDots: true,
dotsPosition: "right",
animateTime: 0.7,
animateFunction: "ease"
});
</script>
</body>

比较e.wheelDeltaY和e.deltaY(或Firefox中的e.deltaMode(以检测触摸板鼠标设备

var isTouchPad = e.wheelDeltaY ? e.wheelDeltaY === -3 * e.deltaY : e.deltaMode === 0
// your code
document.body.textContent = isTouchPad ? "isTouchPad" : "isMouse"
}
document.addEventListener("mousewheel", handler, false);
document.addEventListener("DOMMouseScroll", handler, false);```

最新更新