Interact JS draggable不能正常工作

Question

我正在嘗試在Web項目中使用interact.js作爲它的可拖動/放置功能。然而，使用我能想到的最簡單的例子，我似乎無法拖延做任何事情。這是很奇怪，因爲我能得到這個工作：

interact(target).draggable({ 
    onmove: function(){ console.log('move') } 
}) 

即使我得到的console.log目標不動彈。查看我的例子在這裏codepen：https://codepen.io/vickera/pen/KvRMMg

Answer 1

你必須更新元素的這樣的位置：

interact(target).draggable({onmove: dragMoveListener}) 
function dragMoveListener (event) { 
    var target = event.target, 
    // keep the dragged position in the data-x/data-y attributes 
    x = (parseFloat(target.getAttribute('data-x')) || 0) + event.dx, 
    y = (parseFloat(target.getAttribute('data-y')) || 0) + event.dy; 

    // translate the element 
    target.style.webkitTransform = target.style.transform 
           = 'translate(' + x + 'px, ' + y + 'px)'; 
    // update the posiion attributes 
    target.setAttribute('data-x', x); 
    target.setAttribute('data-y', y); 
}