スムーススクロールを実装！ふわっと出て決まった高さで止まるトップへ戻るボタン

<header id="header"></header>
<div id="content" class="top">
    <!-----ここにコンテンツが入る----->
    <a href="#" id="topBtn">TOP</a>
</div>
<footer id="footer"></footer>

#content{
    position: relative;
}

#topBtn {
    /*-----必須-----*/
    position: fixed;
    bottom: 10px;
    right: 10px;
    
    /*-----装飾-----*/
    width: 64px;
    height: 64px;
    line-height: 64px;
    text-align: center;
    background-color: #333;
    color: #fff;
}

$(document).ready(function () {
    $("#topBtn").hide();　//ボタンを非表示にする
    $(window).on("scroll", function () {
        if ($(this).scrollTop() > 100) { //ページの上から100pxスクロールした時
            $("#topBtn").fadeIn("fast"); //ボタンがフェードインする
        } else {
            $("#topBtn").fadeOut("fast");　//ボタンがフェードアウトする
        }
        scrollHeight = $(document).height(); //ドキュメントの高さ 
        scrollPosition = $(window).height() + $(window).scrollTop(); //現在地 
        footHeight = $("footer").innerHeight(); //止めたい位置の高さ(今回はfooter)
        if (scrollHeight - scrollPosition <= footHeight) { //ドキュメントの高さと現在地の差がfooterの高さ以下の時
            $("#topBtn").css({
                "position": "absolute", //pisitionをabsoluteに変更
            });
        } else { //それ以外の場合は
            $("#topBtn").css({
                "position": "fixed", //固定表示
            });
        }
    });


//スムーススクロール設定
    $('#topBtn').click(function () {
        $('body,html').animate({
            scrollTop: 0
        }, 800);　//スムーススクロールの速度
        return false;
    });
});