使用 JavaScript 滾動回到頂部按鈕一直出現

Question

我創建了一個滾動回到頂部按鈕，我希望它只在頁面向下滾動一點后出現在頁面上。 但是，該按鈕在第一次打開頁面時出現，但在再次向下和向上滾動后它會消失 - 因此按應有的方式運行。 我看了太多代碼，看不出問題出在哪里了：）我應該如何更改下面的代碼，以便按鈕僅在滾動后出現？

HTML部分：

<button onclick="topFunction()" id="button" title="Go to the top">^</button>

JavaScript部分：

var myButton = document.getElementById("button");

window.onscroll = function() {scrollFunction()};

function scrollFunction() {
    if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
        myButton.style.display = "block";
    }
    else {
        myButton.style.display = "none";
    }
}

function topFunction() {
    document.body.scrollTop = 0;
    document.documentElement.scrollTop = 0;
}

感謝您的時間！

Answer 1

默認隱藏它可能是避免故障/閃爍的最佳選擇。

<button style="display: none;" onclick="topFunction()" id="button" title="Go to the top">^</button>