Question

我正在尝试为类似钢琴的网站创建一个小部件/控件。想想4-5个div，一个在另一个之下，位于绝对位置。

<div style="position: relative">
   <div class="quadrant" style="position: absolute; top: 0%; height: 20%></div>
   <div class="quadrant" style="position: absolute; top: 20%; height: 20%></div>
   <div class="quadrant" style="position: absolute; top: 40%; height: 20%></div>
   <div class="quadrant" style="position: absolute; top: 60%; height: 20%></div>
   <div class="quadrant" style="position: absolute; top: 80%; height: 20%></div>
</div>

我希望用户能够在不抬起手指的情况下将手指移动到这些DIVS上！即我不希望这些按钮作为按钮＆＃39;这需要你在咔哒声之间抬起手指，但更像滑块上的点（区别在于，移动滑块时不必抬起手指）。我还想在手指越过新的div时触发一个事件。

我在桌面上使用css和鼠标事件很好地工作，但在手机和平板电脑上花了很多时间。一旦我按照说明尝试移动手指，浏览器就会认为用户正在尝试滚动整个页面（即使我将页面缩小到小于平板电脑视口的位置）。

如何阻止此滚动功能＆＃39;？

我尝试过touchstart和touchmove事件的preventDefault（）;这会关闭滚动，但这也意味着我无法跟踪/选择所选的div。

将手指拖过div键，如钢琴键，防止移动/平板电脑滚动

0 个答案: