移动端拖动元素

1.touchstart、touchmove、touchend可以实现拖动元素

⒉但是拖动元素需要当前手指的坐标值我们可以使用targetTouches[0]里面的pageX和pageY

3.移动端拖动的原理︰手指移动中,计算出手指移动的距离。然后用盒子原来的位置+手指移动的距离

4.手指移动的距离:手指滑动中的位置减去手指刚开始触摸的位置

拖动元素三步曲:
(1)触摸元素touchstart:获取手指初始坐标,同时获得盒子原来的位置

(2)移动手指touchmove :计算手指的滑动距离,并且移动盒子

(3)离开手指touchend:
注意∶手指移动也会触发滚动屏幕所以这里要阻止默认的屏幕滚动e.preventDefault();

posted @   今天穿秋裤了吗  阅读(64)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 如何调用 DeepSeek 的自然语言处理 API 接口并集成到在线客服系统
· 【译】Visual Studio 中新的强大生产力特性
· 2025年我用 Compose 写了一个 Todo App
点击右上角即可分享
微信分享提示