<script language=javascript>
lastScrollY=-0;
function backtop()
{
diffY=document.body.scrollTop;
percent=.1*(diffY-lastScrollY);
if(percent>0)
{
percent=Math.ceil(percent);
}
else
{
percent=Math.floor(percent);
}
document.all.toolTipLayer2.style.pixelTop+=percent;
lastScrollY=lastScrollY+percent;
}
window.setInterval("backtop()",1);
</script>
一句一句来,越详细越好
首先,整段代码应该是从window.setInterval("backtop()",1)开始的,设置了一个定时器,每1毫秒执行一次backtop()。
其次,搞懂几个关键变量的含义:
diffY=document.body.scrollTop 这个diffY就是滚动位置。每次页面滚动,它就会改变(所谓滚动位置,其实就是页面的垂直方向的第几个像素处在浏览器顶部)
lastScrollY这个东东,它的含义并不是上次的滚动位置。我也不知道用什么词来描述它比较好,就直接说它的作用吧:一旦它跟diffY不一样,它就会逐渐向diffY靠近,每次靠近的距离percent等于它俩的差值乘以0.1。
比如一开始lastScrollY是0,滚动位置diffY是100;它就会先增加(100-0)x0.1=10,变成10,然后增加(100-10)x0.1=9,变成19,然后增加(100-19)x0.1=8.1(向上取整得到9),变成28,然后增加(100-28)x0.1=7.2(向上取整得到8)。。。。一直到它等于滚动位置diffY。我们可以看到每次它移动的步长逐渐变短。
想象一下如果有一个东西一开始就在页面顶部,滚动页面的时候,它的位置按照lastScrollY来改变,那么它的移动方式就是开始的时候很快地向滚动位置移动,然后逐渐变慢,最后到达滚动位置。
那么如果有一个东西一开始在距离页面顶部Y0处,每次我们让它的Y0也按照3里的东西同样的速度移动,是不是就可以让它以同样的方式移动到滚动位置+Y0的位置上呢?答案是是的!
document.all.toolTipLayer2.style.pixelTop这个是toolTipLayer2处在页面上的位置Y0了。
欢迎追问
回答的不错,有过还有一个小问题,如果我想做到在网页拖用条放在最顶上的时候自定div的absolute中的top定位如果改这段代码,
目的:在不往下拉时toolTipLayer2的div在网页中的位置可以自行控制,在拉动网页的时候还是保存top为0,请问可以做到吗?