'move': {
inserted: function (el) {
let startX,
currentX = 0;
let parendWidth = 0
let elWidth = 0
el.addEventListener("mousedown", function (event) {
event.preventDefault();
startX = event.pageX - currentX;
elWidth = el.clientWidth
parendWidth = el.parentNode.clientWidth
document.addEventListener("mousemove", onMouseMove);
document.addEventListener("mouseup", onMouseUp);
});
el.addEventListener("touchstart", function (event) {
event.preventDefault();
startX = event.touches[0].clientX - currentX;
elWidth = el.clientWidth
parendWidth = el.parentNode.clientWidth
document.addEventListener("touchmove", onTouchMove);
document.addEventListener("touchend", onTouchEnd);
});
function onMouseUp(event) {
document.removeEventListener("mousemove", onMouseMove);
document.removeEventListener("mouseup", onMouseUp);
}
function onTouchEnd(event) {
document.removeEventListener("touchmove", onTouchMove);
document.removeEventListener("touchend", onTouchEnd);
}
function onTouchMove(event) {
event.preventDefault();
currentX = event.touches[0].clientX - startX;
console.log(currentX)
drag(el);
}
function onMouseMove(event) {
event.preventDefault();
currentX = event.pageX - startX;
drag(el);
}
function drag(el) {
let value = parendWidth - elWidth;
if (currentX <= 0) {
el.style.left = 0 + "px";
} else if (currentX >= value) {
el.style.left = value + "px";
} else {
el.style.left = currentX + "px";
}
}
}
}
03-16
264
05-22
170
12-12
8545
07-19
472
04-28
“相关推荐”对你有帮助么?
-
非常没帮助
-
没帮助
-
一般
-
有帮助
-
非常有帮助
提交