JavaScript控制网页平滑滚动到指定元素位置的方法
本文实例讲述了JavaScript控制网页平滑滚动到指定元素位置的方法。分享给大家供大家参考。具体如下：
functionelementPosition(obj){
varcurleft=0,curtop=0;
if(obj.offsetParent){
curleft=obj.offsetLeft;
curtop=obj.offsetTop;
while(obj=obj.offsetParent){
curleft+=obj.offsetLeft;
curtop+=obj.offsetTop;
}
}
return{x:curleft,y:curtop};
}
functionScrollToControl(id)
{
varelem=document.getElementById(id);
varscrollPos=elementPosition(elem).y;
scrollPos=scrollPos-document.documentElement.scrollTop;
varremainder=scrollPos%50;
varrepeatTimes=(scrollPos-remainder)/50;
ScrollSmoothly(scrollPos,repeatTimes);
window.scrollBy(0,remainder);
}
varrepeatCount=0;
varcTimeout;
vartimeoutIntervals=newArray();
vartimeoutIntervalSpeed;
functionScrollSmoothly(scrollPos,repeatTimes)
{
if(repeatCount<repeatTimes)
{
window.scrollBy(0,50);
}
else
{
repeatCount=0;
clearTimeout(cTimeout);
return;
}
repeatCount++;
cTimeout=setTimeout("ScrollSmoothly('"+scrollPos+"','"+repeatTimes+"')",10);
}
使用方法：
ScrollToControl('elementID');
页面将会平滑的滚动到元素elementID所在的位置
希望本文所述对大家的javascript程序设计有所帮助。