JavaScript-用js在手机浏览器上实现内容上下滚动

JavaScript-用js在手机浏览器上实现内容上下滚动

灵芸 发布于 2017-01-01 字数 91 浏览 959 回复 1

在手机上访问网站,实现手势上下滑动,内容页能够平滑的滚动,要让用户感觉不到是js控制的

如果你对这篇文章有疑问,欢迎到本站 社区 发帖提问或使用手Q扫描下方二维码加群参与讨论,获取更多帮助。

扫码加入群聊

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

偏爱自由 2017-09-06 1 楼

手机端都支持触屏事件,有touchstart,touchmove,touchend, 类似于pc版的鼠标拖动元素,原理是差不多的。
document.ontouchstart = function(e){
var touch = e.touches[0];
y = touch.clientY;
}
document.ontouchmove=function(e){
this.element.style.webkitTransitionDuration="200ms";
this.element.style.webkitTransform='translate3d(0, '+(y-e.touches[0].clientY)+'px, 0)';
}
document.ontouchend=function(e){
}
大概就是这个套路。