JS/CSS 实现网页返回顶部

/* css */
#myBtn {
    display: none; /* 默认隐藏 */
    position: fixed; 
    bottom: 20px; 
    right: 30px; 
    z-index: 99; 
    border: none;
    outline: none; 
    background-color: red; /* 设置背景颜色，你可以设置自己想要的颜色或图片 */
    color: white; /* 文本颜色 */
    cursor: pointer; 
    padding: 15px; 
    border-radius: 10px; /* 圆角 */
    transition: all 0.2;
}

#myBtn:hover {
    background-color: #555; 
}

// js
// 当网页向下滑动 20px 出现"返回顶部" 按钮
window.onscroll = function() {scrollFunction()};

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

// 点击按钮，返回顶部
function topFunction() {
    document.body.scrollTop = 0;
    document.documentElement.scrollTop = 0;
}