[英]Javascript touchmove event on scroll element
所以,我有一个关于获取元素移动touchmove事件的问题。
这是我的代码:
<ul>
<li>this is long Text</li>
<li>this is long Text</li>
<li>this is long Text</li>
<li>this is long Text</li>
</ul>
ul {list-style:none; overflow-y:scroll; white-space:nowrap; }
ul li {display:inline-block; width:600px; margin-right:10px; }
document.getElementsByTagName("ul")[0].addEventListener("touchmove", function(e) {
var touch = e.touches[0] || e.changedTouches[0];
var elm = this.offsetLeft;
var x = touch.pageX - elm;
this.scrollLeft = x;
console.log(x);
});
如何使这个事情在touchmove事件上移动?
就像play.google.com移动视图对他们的游戏产品图像一样吗?
我知道如果我在滚动条上单击/触摸它会移动,我应该在这里做什么,
如果我触摸并移动UL元素而不是滚动条,它会移动。
谢谢..
你只需要使用鼠标轮js
$('ul').mousewheel(function(event, delta) {
this.scrollLeft -= (delta * 20);
event.preventDefault();
});
“20”代表速度。 preventDefault确保页面不会向下滚动。 也适用于触摸设备。 触摸即可滚动。
这是一个例子: demo
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.