实现回到顶部的功能，根据学了元素滚动实现，温习知识点。
做之前先理清一下步骤和思路：
1、获得页面的滚动长度
var $page = $("html,body");
var distance = $("html").scrollTop()+$("body").scrollTop();
2、设置总时间
var time = 500;
3、设置间隔时间
var intervalTime = 50;
4、使用循环定时器不断滚动
5、/到达顶部, 停止定时器
//获得每次滑动的距离
var interdistance = distance/(time/intervalTime);
var inervaltimer = setInterval(function(){
distance -= interdistance;
if (distance<=0) {
distance = 0;
// 到达顶部, 停止定时器
clearInterval(inervaltimer);
}
$page.scrollTop(distance);
},intervalTime)
大概的设计应该差不多都是这样子，接下来的就是不同的场景举一反三
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#to_top{
width: 30px;
height: 40px;
background: blue;
font: 15px/20px arial;
position: fixed;
top: 700px;
left: 1850px;
text-align: center;
color: #fff;
cursor: pointer;
}
</style>
</head>
<body style="height: 2000px;">
<div id="to_top">返回顶部</div>
<script type="text/javascript" src="../../../js/jquery-1.10.1.js" ></script>
<script type="text/javascript">
$("#to_top").click(function(){
//设置则使用$("html,body")
//获取的话，则使用分开的形式
//$("html,body").scrollTop(0);
var $page = $("html,body");
//获得滑动的总长度
var distance = $("html").scrollTop()+$("body").scrollTop();
//滑动所需要的时间
var time = 500;
//间隔时间
var intervalTime = 50;
// 使用循环定时器不断滚动
//获得每次滑动的距离
var interdistance = distance/(time/intervalTime);
var inervaltimer = setInterval(function(){
distance -= interdistance;
if (distance<=0) {
distance = 0;
// 到达顶部, 停止定时器
clearInterval(inervaltimer);
}
$page.scrollTop(distance);
},intervalTime) })
</script>
</body>
</html>