移动html触摸效果,JS实现移动端触屏拖拽功能

2.css

3.js

= maxW) {

oLeft = maxW;

}

if(oTop < 0) {

oTop = 0;

} else if(oTop >= maxH) {

oTop = maxH;

}

div1.style.left = oLeft + 'px';

div1.style.top = oTop + 'px';

});

//触摸结束时的处理

div1.addEventListener('touchend',function() {

document.removeEventListener("touchmove",defaultEvent);

});

//阻止默认事件

function defaultEvent(e) {

e.preventDefault();

}

3.效果

4.几点说明

对于触屏手机端用手指事件,对于PC端用鼠标事件,其实原理都一样。

总结

以上所述是小编给大家介绍的JS实现移动端触屏拖拽功能。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持。

总结

以上是编程之家为你收集整理的JS实现移动端触屏拖拽功能全部内容,希望文章能够帮你解决JS实现移动端触屏拖拽功能所遇到的程序开发问题。

如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。

小编个人微信号 jb51ccc

喜欢与人分享编程技术与工作经验,欢迎加入编程之家官方交流群!

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值