javascript - 我将如何使用 javascript/jquery 进行两指拖动？

Question

我正在尝试创建当有两个手指放在 div 上时拖动它的能力。

我已将 div 绑定(bind)到 touchstart 和 touchmove 事件。我只是不确定如何编写函数。

类似于 if event.originalEvent.targetTouches.length => 2 设置起始 X 和 Y。

我是否平均两个手指的位置？然后对数据应用 css 转换？如何将其从 DOM 流中拉出来，静态定位？

任何例子都很好，谢谢!

Answer 1

在 CoffeeScript 中，为了泛化的目的，我还对其进行了编辑以使用全局变量。我没有使用全局变量。

    $('#div').bind 'touchstart', touchstart
    $('#div').bind 'touchmove', touchmove

    touchstart: (event) =>
        if event.originalEvent.touches.length >= 2

            x = 0
            y = 0

            for touch in event.originalEvent.touches
                x += touch.screenX
                y += touch.screenY

            window.startx = x/event.originalEvent.touches.length
            window.starty = y/event.originalEvent.touches.length

    touchmove: (event) =>
        if event.originalEvent.touches.length >= 2

            x = 0
            y = 0

            for touch in event.originalEvent.touches
                x += touch.screenX
                y += touch.screenY

            movex = (x/event.originalEvent.touches.length) - @startx
            movey = (y/event.originalEvent.touches.length) - @starty

            newx = $('#div').offset().left + movex
            newy = $('#div').offset().top + movey

            $('#div').offset({top: newy, left: newx})

            window.startx = x/event.originalEvent.touches.length
            window.starty = y/event.originalEvent.touches.length