<!DOCTYPE html>
<html lang="en">
<head>
<style>
#btn1 {position:fixed; bottom:0; right:0;}
body{
height: 2000px;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>
window.onload=function (){
oBtn=document.getElementById("btn1");
var timer=null;
var bSys=true;//是系统自动让滚动的
//这是滚动条滚动的时候,来检查是人为滚动还是系统滚动
window.onscroll=function () {
if(!bSys){
clearInterval(timer);
}
bSys=false;
}
oBtn.onclick=function () {
/timer= setInterval(function () {
var browser=document.documentElement||document.body;
var scllTop=browser.scrollTop||browser.scrollTop;
var iSpeed=Math.floor(-scllTop/8);//向下取整
if( browser.scrollTop==0){
clearInterval(timer);
}
bSys=true;
browser.scrollTop=scllTop+iSpeed;
},30);这样写可能会遇到兼容性问题,至于为什么欢迎大神补充,我是没看出来,在我们的项目中确实不可以,/
timer= setInterval(function () {
var scllTop=document.documentElement.scrollTop||document.body.scrollTop;
var iSpeed=Math.floor(-scllTop/8);//向下取整
if( scllTop.scrollTop==0){
clearInterval(timer);
}
bSys=true;
if(document.body.scrollTop){
/* alert("ie");/
document.body.scrollTop=scllTop+iSpeed;
}else{
/ alert("火狐");*/
document.documentElement.scrollTop=scllTop+iSpeed;
}
},30);
}
};
</script>
</head>
<body>
1<br />2<br />3<br />4<br />5<br />6<br />7<input id="btn1" type="button" value="回到顶部" />
</body>
</html>