** （1） 觸控元素 touchstart： 獲取手指初始座標，同時獲得盒子原來的位置
（2） 移動手指 touchmove： 計算手指的滑動距離，並且移動盒子
（3） 離開手指 touchend:**
e.targettouches[0].pagex 、e.targettouches[0].pagey
這兩個為手指移動時 在頁面上的座標；
>
var div = document.
queryselector
('div');
var startx =0;
var starty =0;
var x =0;
var y =0;
div.
addeventlistener
('touchstart'
,function
(e))
; div.
addeventlistener
('touchmove'
,function
(e))
;script
>
元素可拖拽（移動端與pc端）
專案中經常遇到這種需求，特此記錄下 css部分 html部分 js部分 這裡分了兩種情況，因為pc端與移動端的處理情況有點不太一樣 1 pc端 const winw window.innerwidth const winh window.innerheight const target docume...
移動端觸屏實現元素拖拽功能
手指拖拽 options引數控制水平或垂直方向是否可以拖拽 function drag el,options 手指按下點座標 var downpoint 本次手指按下是否有滑動 var istouchmove false el.addeventlistener touchstart handlest...
移動端拖拽模型
移動端的拖拽製作原理和 pc 端思路是一樣的。都是通過各自的api獲取事件的位置，然後求差，通過絕對定位來改變元素的位置。寫前了解 移動端的三個事件touchstart touchmove touchend 分別對應移動端手指按下，移動，抬起。三個事件必須使用 dom 二級新增監聽。其中前兩個事件對...