32 lines
989 B
JavaScript
32 lines
989 B
JavaScript
|
export default{
|
||
|
|
bind(el, binding, vnode) {
|
||
|
|
let dragging = false;
|
||
|
|
let startX, startY, deltaX, deltaY, transform;
|
||
|
|
|
||
|
|
el.style.position = 'absolute';
|
||
|
|
el.style.cursor = 'pointer';
|
||
|
|
|
||
|
|
el.addEventListener('mousedown', function(e) {
|
||
|
|
dragging = true;
|
||
|
|
startX = e.clientX - parseInt(el.style.left);
|
||
|
|
startY = e.clientY - parseInt(el.style.top);
|
||
|
|
document.addEventListener('mousemove', mouseMoveHandler);
|
||
|
|
document.addEventListener('mouseup', mouseUpHandler);
|
||
|
|
});
|
||
|
|
|
||
|
|
function mouseMoveHandler(e) {
|
||
|
|
if (dragging) {
|
||
|
|
deltaX = e.clientX - startX;
|
||
|
|
deltaY = e.clientY - startY;
|
||
|
|
el.style.left = deltaX + 'px';
|
||
|
|
el.style.top = deltaY + 'px';
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function mouseUpHandler() {
|
||
|
|
dragging = false;
|
||
|
|
document.removeEventListener('mousemove', mouseMoveHandler);
|
||
|
|
document.removeEventListener('mouseup', mouseUpHandler);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|