html鼠标可拖动窗体,JS实现简单移动端鼠标拖拽

本文实例为大家分享了JS实现移动端鼠标拖拽的具体代码，供大家参考，具体内容如下

Document

#div {

width: 100%;

height: 200px;

background: rosybrown;

}

#button {

position: absolute;

}

看我的魔法屌不屌

var button = document.getElementById('button')

button.ontouchstart = function(e) {

var startX = e.touches[0].clientX - this.offsetLeft;

var startY = e.touches[0].clientY - this.offsetTop;

this.ontouchmove = function(e) {

button.style.left = e.touches[0].clientX - startX + 'px';

button.style.top = e.touches[0].clientY - startY + 'px';

}

}

button.ontouchend = function() {

button.ontouchmove = null;

}

更多精彩文章请点击专题： Javascript拖拽特效汇总

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

时间： 2020-07-21