我在这里有一些代码:https://codepen.io/anon/pen/PrZqqR
我想做的是在<720像素的屏幕上实现拖放行为
在知道要为此拖动的框应该为position: relative
的情况下,如何最后指定移动功能。仅欢迎使用香草JS。谢谢!
else if (window.innerWidth <= 720) {
for (var i = 0; i < images.length; i++) {
images[i].addEventListener('touchstart', touchstart);
images[i].addEventListener('touchend', touchend);
}
}
function touchstart() {
window.startTime = new Date();
}
function touchend() {
window.endTime = new Date();
if (window.endTime - window.startTime < 1000) {
// just show preview as time is < 1 sec
// url for the img src
let url = "url(" + this.childNodes[1].getAttribute("src") + ")";
// hide preview text
document.querySelector(".alert").style.display = "none";
// set preview image
target.style.backgroundImage = url;
target.classList.add("back_set");
// end of simple click event
} else {
// this section handels the dragging story
// add shake and start dragging, time is > 1 sec
console.log("more than 1 sec");
// make draggable
this.setAttribute("draggable", "true");
this.style.position = "absolute";
// make shake animation
this.style.animation = "shake 1s infinite";
var x = parseInt(this.style.left);
var y = parseInt(this.style.top);
this.addEventListener("touchmove", move);
}
}
function move() {
console.log("moving");
}