var h1=Math.max(document.documentElement.clientHeight,document.body.clientHeight);
var h2=Math.min(document.documentElement.clientHeight,document.body.clientHeight);
var st=h1-h2;
var v=st/6000;//缓动公式
var t1=Date.now();
function run(){
var _t=Date.now()-t1;
if(document.body.scrollTop>=st){
return;
}
document.body.scrollTop=v*_t;
setTimeout(run,1000/60)
}
run();
上面一段代码就是一个简单的控制scrollTop的动画,这也是目前制作动画的基本方法。可以看缓动公式这一行,要调整滚动的速度,我们就改变速度v就ok了。你要是有兴趣可以复制到浏览器的控制台运行一下。
还有使用不同的缓动公式可以实现不同缓动效果的动画,例如自由落体运动,这个公式物理上有学过
改setInterval的时间呗..
+= 100
scrollLeft + 20