<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
body{height:2000px;}
#to_top{background:red; height:27px; 41px; position:fixed; right:10px; bottom:0px; display:none; cursor:pointer;}
</style>
</head>
<body>
<div id="to_top"></div>
</body>
</html>
<script>
var to_top=document.getElementById('to_top');
//当滚动条滚动的时候，应应用onscroll事件
var time;
window.onscroll=function()//执行以下方法
{
var scrollTop=document.body.scrollTop || document.documentElement.scrollTop;
//获取滚动条的高度 当document.body.scrollTop(ff)不兼容时 ||使用document.documentElement.scrollTop;
if(scrollTop==0){
clearInterval(time);
//如果滚动条高度为0的时候
to_top.style.display='none';
}
else
{
to_top.style.display='block';
}
}
to_top.onclick=function()
{
time=setInterval(function(){
if(document.body.scrollTop)
//如果浏览器找到 document.body.scrollTop ，改变这个属性的值为0.这个就是浏览器滚动条的值 应用于高版本的浏览器
{
//浏览器高度=浏览器高度-20px; document.body.scrollTop=document.body.scrollTop-20;
document.body.scrollTop-=20;
}
else
//否则浏览器不兼容上面的属性时，改应用document.documentElement.scrollTop 低版本浏览器的对象值为0；
{
document.documentElement.scrollTop-=20;
}
},50)
}
</script>