页面滚动到顶部功能以及按钮隐藏显示

在页面中内容很多时，常常需要一键置顶的功能。即页面的右下角会显示一个向上的箭头，点击一下，就直接滚动到页面最上面。当滑动到第一页时，此时不需要置顶，置顶的箭头自动隐藏。

大家观察一下，内容较多在门户网站，例如新浪、网易均有这样的功能。那这个小功能是如何实现的呢？ 直接上代码吧

<div class="content">
    <p>等你, 在雨中, 在造虹的雨中
蝉声沉落, 蛙声升起
一池的红莲如红焰, 在雨中
你来不来都一样, 竟感觉
每朵莲都像你
尤其隔着黄昏, 隔着这样的细雨
永恒, 刹那, 刹那, 永恒
等你, 在时间之外在时间之内,
等你, 在刹那, 在永恒
如果你的手在我的手里, 此刻
如果你的清芬
在我的鼻孔, 我会说, 小情人
    </p>
</div>
<div class="goToTop none">
        置顶
</div>

$('body').on('click', 'p', function () {
            var _this = $(this);
            var copyed = _this.clone(true);
            _this.after(copyed);
        });
        $(window).on('scroll', function () {
            var scrollTop = $('body').scrollTop();
            if (scrollTop > 300) {
                $('.goToTop').removeClass('none');
            }else {
                $('.goToTop').addClass('none');
            }
        });
        $('.goToTop').on('click', function(){
            $('body').scrollTop(0);
        });

  css

.goToTop {
    position: fixed;
    right: 0;
    bottom: 10px;
    z-index: 200;
    width: 20px;
    background-color: #2e6da4;
}

 注：这里偷人懒，用文字“置顶”代替了箭头。置顶的文字(或箭头)应该始终在页面右下角区域，并且是可见状态，所以需要是position: fixed。