2011-10-28 48 views
3

我想創建拖動div時有兩個手指放在它上面的能力。我該如何用javascript/jquery做雙指拖動?

我已經將div綁定到touchstart和touchmove事件。我只是不確定如何編寫函數。

喜歡的東西if event.originalEvent.targetTouches.length => 2集開始X和Y

難道我平均的兩個手指位置?然後應用css變換與數據?我如何將它從DOM的流程中靜態定位?

任何例子都會很棒,謝謝!

回答

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