html结构:------------------------------------------------------------------
<div class="go-top">返回顶部</div>
css样式:----------------------------------------------------------------------
.go-top {
position: fixed;
bottom: 10px;
right: 10px;
background: #fff;
display: none;
cursor: pointer;
}
js代码:----------------------------------------------------------------------
window.onscroll=function(){
if($(window).scrollTop()>100){
$('.go-top').show();
}else{
$('.go-top').hide();
}
}
$('.go-top').click(function(){
scroll('0px', 300);
});
function scroll(scrollTo, time) {
var scrollFrom = parseInt(document.body.scrollTop),
i = 0,
runEvery = 5; // run every 5ms
scrollTo = parseInt(scrollTo);
time /= runEvery;
var interval = setInterval(function () {
i++;
document.body.scrollTop = (scrollTo - scrollFrom) / time * i + scrollFrom;
if (i >= time) {
clearInterval(interval);
}
}, runEvery);
}