现在按照网上的用translate3d完成了模拟滚动,但是滚动效果很痛苦,不知应该如何优化,才能像scroll那样做到正常滑动啊?现所用模拟代码如下:
var gundongX = 0;
var gundongY = 0;
var d = document;
var g = 'getElementById';
var moveEle = d[g]('scroller');
var stx = sty = etx = ety = curX = curY = 0;
moveEle.addEventListener("touchstart", function(event) { //touchstart
gundongX = 0;
gundongY = 0;
// 元素当前位置
etx = parseInt(getT3d(moveEle, "x"));
ety = parseInt(getT3d(moveEle, "y"));
// 手指位置
stx = event.touches[0].pageX;
sty = event.touches[0].pageY;
}, false);
moveEle.addEventListener("touchmove", function(event) {
// 防止拖动页面
event.preventDefault();
// 手指位置 减去 元素当前位置 就是 要移动的距离
gundongX = event.touches[0].pageX - stx;
gundongY = event.touches[0].pageY - sty;
// 目标位置 就是 要移动的距离 加上 元素当前位置
curX = gundongX + etx;
curY = gundongY + ety;
if(curY>0){
curY = 0;
} else if(curY<=window.innerHeight-todObj.sousuoTopObj.pageHeight){
//到达底部,下拉刷新
curY = window.innerHeight-todObj.sousuoTopObj.pageHeight;
if(todObj.indexPageObj.pageNum == 2){
if(todObj.indexPageObj.slide_type==1){
if( (todObj.indexPageObj.currentpage
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
可以加上 transition 属性优化效果还可以加上缓动函数优化性能。还想进一步优化,你可以看看 iScroll 的源码学习学习