zl程序教程

您现在的位置是:首页 >  后端

当前栏目

js控制滚动条示例

JS控制 示例 滚动条
2023-09-27 14:29:33 时间
//alert(document.body.scrollHeight);
timer1=setInterval("runToButtom()",1);

}
function runToTop(){
currentPosition=document.documentElement.scrollTop || document.body.scrollTop;
currentPosition-=10;
if(currentPosition 0)
{
window.scrollTo(0,currentPosition);
}
else
{
window.scrollTo(0,0);
clearInterval(timer);
alert("over_top");
}
}
function runToButtom(){
currentPosition=document.documentElement.scrollTop || document.body.scrollTop;
currentPosition+=10;

var topheight=document.body.scrollHeight-document.body.clientHeight;
//alert(currentPosition+"---"+topheight);
if(currentPosition topheight)
{
window.scrollTo(0,currentPosition);
}
else
{
window.scrollTo(0,topheight);
clearInterval(timer1);
alert("over_buttom");
}
}
/script
style type="text/css"
/style
/head
body
div 饭 /div div 吃 /div div 家 /div div 回 /div div 你 /div div 带 /div div id="back-up" 返回顶部 /div script
GoButtom();
/script
/body
/html

我们在项目中可能会遇到这样的需求,控制页面滚动条的位置,来显示不同的内容。这里给出一个使用原生js来控制滚动条的方法,实现起来非常简单 一、HTML代码 1111111111111111111111 111111111111111...