返回顶部
我写的这个返回到顶部的代码是引用了jquery方法，复制下面的一段代码，就可以看到效果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>返回顶部</title>
<style type="text/css">
.back_top{
position: fixed;
z-index: 9000;
right: 30px;
bottom: 30px;
background: #ccc;
border-radius: 5px;
display: none;
cursor: pointer;
padding: 10px;
}
</style>
</head>
<body>
<p>这里是头部</p>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<div class="back_top">返回顶部</div>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(window).scroll(function() {
var sc=$(window).scrollTop();
if(sc>0){
$(".back_top").css("display","block");
}
else{
$(".back_top").css("display","none");
}
});
$(".back_top").click(function(){
var sc=$(window).scrollTop();
$("body,html").animate({scrollTop:0},500);
});
});
</script>
</body>
</html>
思路：当滚动条大于0的时候，底部显示返回顶部的按钮，当点击返回顶部按钮时，动态的让滚动条为0；
