html

<div class="to-top" id="toTop"><i class="fa fa-arrow-up"></i></div>

为了实现一个当页面滚动超过100像素时隐藏的“返回顶部”按钮功能，您可以使用以下 JavaScript 代码。此代码侦听页面的滚动事件，并根据当前滚动位置显示或隐藏“返回顶部”按钮。

// 获取返回顶部按钮的元素
var toTopButton = document.getElementById('toTop');

// 检查滚动位置并更新按钮的显示状态
function checkScrollPosition() {
    if (window.scrollY > 100) {
        toTopButton.style.display = 'block';
    } else {
        toTopButton.style.display = 'none';
    }
}

// 添加滚动事件监听器
window.addEventListener('scroll', checkScrollPosition);

// 点击按钮时页面滚动到顶部
toTopButton.onclick = function() {
    window.scrollTo({
        top: 0,
        behavior: 'smooth'
    });
};

这段代码实现了以下功能：

当页面向下滚动超过100像素时，按钮会显示。
当页面滚动回小于100像素的位置时，按钮会隐藏。
点击按钮时，页面平滑滚动回顶部。
您只需将此代码添加到网页的 <script> 标签中或作为一个外部 JavaScript 文件。注意，由于这里没有提供 CSS 样式，您可能需要根据网页的具体布局和样式来调整按钮的初始显示状态（如 display: none）。