1

我想阻止我在 iPhone 上的页面上的默认滚动操作，但单个 div 除外。基本上，当有人在屏幕上滑动手指时——屏幕上的任何地方——这个单一的 div 应该移动。当有人直接触摸 div 元素时，我使用的代码可以正常工作，但否则 div 的位置非常不稳定。我在哪里搞砸了？这是我在Safari Developer Library中找到的内容的松散修改。

<div id="testdiv">
   test test test test
</div>
<script type="text/javascript">
        var startY = document.getElementById("testdiv").offsetTop;
        var curY = startY;
        var touchY;

        document.addEventListener('touchstart', function(event) {
            touchY = event.targetTouches[0].pageY;
        }, false);

        document.addEventListener('touchmove',function(event) {
            event.preventDefault();
            curY = event.targetTouches[0].pageY - startY - touchY;
            document.getElementById("testdiv").style.webkitTransform = 'translate(0px,' + curY + 'px)';
        }, false);

        document.addEventListener('touchend',function(event) {
            startY = curY;
        }, false);
</script>
4

1 回答 1

3

更改- startY的+ startY值时更改为curY。问题不在于它仅在您触摸 div 时才有效。的值...pageY - touchY将是自首次记录以来触摸已移动的距离。如果之前的偏移量是 50 像素并且向下移动了 20 像素，那么您希望新的偏移量为 20 + 50，而不是 20 - 50。您在第一次触摸时没有注意到问题，因为 的初始值startY是 close到 0。事实上，初始值startY应该是 0，而不是offsetTopdiv，因为平移将相对于起始偏移量应用。

于 2011-05-03T05:17:39.193 回答