以下是一个简单的JavaScript平滑返回顶部代码:

// 获取返回顶部按钮
var topButton = document.getElementById("topButton");

// 当页面滚动时显示或隐藏返回顶部按钮
window.onscroll = function() {
    if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
        topButton.style.display = "block";
    } else {
        topButton.style.display = "none";
    }
};

// 当点击返回顶部按钮时平滑滚动到顶部
topButton.onclick = function() {
    // 获取当前滚动位置
    var scrollToTop = window.setInterval(function() {
        var pos = window.pageYOffset;
        if (pos > 0) {
            window.scrollTo(0, pos - 20); // 每次滚动20像素
        } else {
            window.clearInterval(scrollToTop);
        }
    }, 10);
};

要使用此代码,请将其添加到页面的JavaScript文件或标记中,并将“topButton”替换为您页面上实际的返回顶部按钮的ID。

JavaScript平滑返回顶部代码

原文地址: https://www.cveoy.top/t/topic/6QN 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录