Question

我试图在触摸时平移元素，我使用以下内容来计算用户滑动的距离（并在滑动初始化后添加过渡/功能）如何获得滑动和动画的实时值说一个DIV跟着手指走？

我使用以下代码来实现滑动功能：

Answer 1

您需要将脚本分开一点才能实现所需的功能。基本上你所拥有的是将“滑动”保存到单个事件，你需要捕获这样的touchMove事件：

//add to the decleration:
var defaults = {
    threshold: {
        x: 30,
        y: 10
    },
    swipeLeft: function() { alert('swiped left') },
    swipeRight: function() { alert('swiped right') },
    //THIS:
    swipeMove: function(distance) { alert('swiped moved: '+distance.x+' horizontally and '+distance.y+' vertically') },
    preventDefaultEvents: true
};

//add this to the init vars section
var lastpoint = {x:0, y:0}

//add an init to the lastpoint at start of swipe
function touchStart(event) {
        console.log('Starting swipe gesture...')
        originalCoord.x = lastpoint.x = event.targetTouches[0].pageX
        originalCoord.y = lastpoint.y = event.targetTouches[0].pageY
    }

//this is where you do your calculation
function touchMove(event) {
        if (defaults.preventDefaultEvents)
            event.preventDefault();

        var difference = {
            x:event.targetTouches[0].pageX - lastpoint.x,
            y:event.targetTouches[0].pageY - lastpoint.y
        }
        //call the function
        defaults.swipeMove(difference);

        finalCoord.x = lastpoint.x = event.targetTouches[0].pageX 
        finalCoord.y = lastpoint.y = event.targetTouches[0].pageY
    }

无论如何，

应该是类似的东西，虽然经过了测试。

触摸平移元素 - jQuery

1 个答案: