javascript实现移动端上的触屏拖拽功能

html部分

 
     

css部分

  

说明:*通配符慎用,一般引用reset.css来清除需要清除的margin,padding。

初始效果如下

javascript实现移动端上的触屏拖拽功能_第1张图片
2.png

js部分

    

变量说明:

maxW:div1可移动的最大宽度
maxH:div1可移动的最大高度
oL、oT:鼠标所点位置的坐标

实现效果:


javascript实现移动端上的触屏拖拽功能_第2张图片
1.gif

你可能感兴趣的:(javascript实现移动端上的触屏拖拽功能)