jquery 回到顶部，简洁大方

效果

HTML

<div id="back-to-top" title="返回顶部"><i class="fa fa-chevron-up"></i></div>

style

<style>
/*returnTop*/
div#back-to-top {
font-size: 40px;
position: fixed;
display: none;
bottom: 100px;
right: 60px;
cursor: pointer;
}
</style>

script

<script>
$(function () {
$(window).scroll(function () {
if ($(window).scrollTop() > 200) {
$("#back-to-top").fadeIn(1000);
}
else {
$("#back-to-top").fadeOut(1000);
}
});

//点击返回顶部
$("#back-to-top").click(function () {
$('body,html').animate({ scrollTop: 0 }, 1000);
return false;
});
});
</script>

注意，要引入 font-awesome.css 才可显示图标