扫码关注官方订阅号
为什么我的这串代码只能执行一次以后就没法触发事件了?
闭关修行中......
事实上这个和translate有关,原因我还找不到,不过当使用translate时,如果拖动超过来原来的位置,那么touchmove就不再触发,而用translate3d就不会。
你可以试试这样。
var pagey1; var pagey2; var lastMove = 0; function load() { var obj=document.querySelector('.box'); obj.addEventListener("touchstart", touch,false); obj.addEventListener("touchmove", touch,false); obj.addEventListener("touchend", touch,false); function touch(e) { console.log(e.type); e.target.cancelable = true; var e = e||window.event; switch(e.type) { case "touchstart": e.preventDefault(); pagey1 = e.touches[0].pageY; console.log("start"); break; case "touchmove": e.preventDefault(); pagey2 = e.touches[0].pageY obj.style.transform = "translate3d(0px, " + (pagey2- pagey1 + lastMove) + "px, 0px)"; break; case "touchend": lastMove = pagey2 - pagey1 + lastMove; console.log("end"); break; } } }
你的代码貌似是弄个滑动,当你滑了之后,第一个走掉,出来第二个,而你你选择器 querySelect(“.box”)只是选了第一个元素,所以后面的都没有绑定监听,如果你要选择所有的 .box 类,请使用 querySelecAll()
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
事实上这个和translate有关,原因我还找不到,不过当使用translate时,如果拖动超过来原来的位置,那么touchmove就不再触发,而用translate3d就不会。
你可以试试这样。
你的代码貌似是弄个滑动,当你滑了之后,第一个走掉,出来第二个,而你你选择器 querySelect(“.box”)只是选了第一个元素,所以后面的都没有绑定监听,如果你要选择所有的 .box 类,请使用 querySelecAll()