Блог

Я пытаюсь создать возможность перетаскивания div, когда на него помещены два пальца.

Я привязал div к событиям touchstart и touchmove. Я просто не уверен, как писать функции.

Что-то вроде if event.originalEvent.targetTouches.length => 2 set starting X и Y.

Усреднять ли позиции двух пальцев? Затем примените преобразования css с данными? Как мне вытащить его из потока DOM, статическое позиционирование?

Любые примеры были бы замечательными, спасибо!

В 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