disable dragable elements for touch devices
This commit is contained in:
parent
2ed48fac10
commit
e923c4c87b
23
drag.js
23
drag.js
@ -26,19 +26,13 @@ function move(e) {
|
||||
|
||||
target.setAttribute('data-moving', '1');
|
||||
|
||||
if (e.clientX) {
|
||||
target.oldX = e.clientX; // If they exist then use Mouse input
|
||||
target.oldY = e.clientY;
|
||||
} else {
|
||||
target.oldX = e.touches[0].clientX; // Otherwise use touch input
|
||||
target.oldY = e.touches[0].clientY;
|
||||
}
|
||||
target.oldX = e.clientX;
|
||||
target.oldY = e.clientY;
|
||||
|
||||
target.oldLeft = window.getComputedStyle(target).getPropertyValue('left').split('px')[0] * 1;
|
||||
target.oldTop = window.getComputedStyle(target).getPropertyValue('top').split('px')[0] * 1;
|
||||
|
||||
document.addEventListener('mousemove', drag);
|
||||
document.addEventListener('touchmove', drag, {passive: true});
|
||||
|
||||
function drag(event) {
|
||||
event.preventDefault();
|
||||
@ -46,16 +40,11 @@ function move(e) {
|
||||
if (!target.moving) {
|
||||
return;
|
||||
}
|
||||
if (event.clientX) {
|
||||
target.distX = event.clientX - target.oldX;
|
||||
target.distY = event.clientY - target.oldY;
|
||||
} else {
|
||||
target.distX = event.touches[0].clientX - target.oldX;
|
||||
target.distY = event.touches[0].clientY - target.oldY;
|
||||
}
|
||||
target.distX = event.clientX - target.oldX;
|
||||
target.distY = event.clientY - target.oldY;
|
||||
|
||||
newLeft = target.oldLeft + target.distX;
|
||||
newTop = target.oldTop + target.distY;
|
||||
newTop = target.oldTop + target.distY;
|
||||
target.style.left = stepedSize(newLeft) + "px";
|
||||
target.style.top = stepedSize(newTop) + "px";
|
||||
}
|
||||
@ -65,13 +54,11 @@ function move(e) {
|
||||
target.setAttribute('data-moving', '0');
|
||||
}
|
||||
document.addEventListener('mouseup', endDrag)
|
||||
document.addEventListener('touchend', endDrag)
|
||||
}
|
||||
|
||||
function activateDraggables() {
|
||||
for (var draggable of draggables) {
|
||||
draggable.addEventListener('mousedown', move);
|
||||
draggable.addEventListener('touchstart', move, {passive: true});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user