Javascript 使用JS返回顶部按钮

当你点击一个按钮时，它会在页面顶部发送给你，但是它有一个问题。 我需要返回到顶部的按钮，当页面以100px的速度滚动时出现，如果页面低于100px就会消失，我已经尝试了我的示例，但没有成功

函数animateToTop（e）{
e、 预防默认值（）；
让scrollToTop=window.setInterval（函数（）{
设pos=window.pageYOffset；
如果（位置>0&&pageYOffset>=10）{
窗口。滚动至（0，位置-20）；
document.querySelector（'.scrolimg'）.style.visibility='visible'；
}否则{
窗口清除间隔（scrollToTop）；
document.querySelector（'.scrolimg'）.style.visibility='visible'；
}
}, 9);
}

.scrolimg{
宽度：88px；
高度：79px；
}
.卷轴{
宽度：100px；
高度：80px；
位置：粘性；
顶部：640px；
左：1350px；
过渡：0.2s；
z指数：99；
}
.滚动：悬停{
变换：比例（1.2）
}
身体{
高度：1400px；
背景：黄绿色；
保证金：0；
填充：0；
}
.bg1{
高度：650px；
背景：红色；
}

---

为

滚动添加了一个事件监听器，该监听器将检查当前的
topScroll
，并更改
样式。显示
的
。相应滚动
。我还在
css
位置：fixed
底部：0px
右侧：0px


document.addEventListener（'scroll'，（e）=>{
设scrollTop=window.pageYOffset | | document.documentElement.scrollTop；
如果（scrollTop>100）document.querySelector（'.scroll'）.style.display=“block”；
else document.querySelector（'.scroll'）.style.display=“无”
})
函数animateToop（e）{
e、 预防默认值（）；
让scrollToTop=window.setInterval（函数（）{
设pos=window.pageYOffset；
如果（位置>0&&pageYOffset>=10）{
窗口。滚动至（0，位置-20）；
document.querySelector（'.scrolimg'）.style.visibility='visible'；
}否则{
窗口清除间隔（scrollToTop）；
document.querySelector（'.scrolimg'）.style.visibility='visible'；
}
}, 
9
)
}
.scrolimg{
宽度：88px；
高度：79px；
}
.卷轴{
宽度：100px；
高度：80px；
过渡：0.2s；
z指数：99；
位置：固定；
底部：0px；
右：0px；
}
.滚动：悬停{
变换：比例（1.2）
}
身体{
高度：1200px；
背景：黄绿色；
保证金：0；
填充：0；
}
.bg1{
高度：450px；
背景：红色；
}
更改
动画Top
并添加
滚动行为：平滑。它应该做以下工作：

function animateToTop(e) {
    window.scrollTo(0, 0);
}

window.addEventListener('scroll', (e) => {
    var scrollTopBtn = document.getElementsByClassName('scrolimg')[0];
    if (window.scrollY >= 100) {
        scrollTopBtn.style.visibility = 'visible';
    } else {
        scrollTopBtn.style.visibility = 'hidden';
    }
});

html{
滚动行为：平滑；
}

您还可以使用：

document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;

但是没有更多的动画了
一些评论：1）
pageYOffset
是未定义的，所以它永远不会
=10
（因为它被转换为
NaN
）2）我不明白你的JS，它不会做任何事情，直到你点击按钮，然后它设置了一个计时器，每9毫秒触发一次？因此，在发生任何事情之前，您必须向下滚动到按钮。3） 您正在将
可见性
属性设置为
可见
，但这是默认设置，您尚未将其设置为
隐藏
开始with@j08691这是动画滚动的代码…@RobinZigmond-1）pageYOffset未定义，您能告诉我如何定义吗，因为它在Console.Log上没有显示任何错误。2） 是的，我的JS有点乱，因为我想滚动一些像素，所以按钮可能会显示或隐藏。3） 我在另一个线程中发现了Visibility，并尽了最大努力使其工作，但它没有工作，您能否尝试帮助我更正整个代码配合？因此，如果页面被滚动，请添加一个滚动事件侦听器，而不是使固定按钮可见。@Behar-“您能告诉我如何定义”-我看您根本不需要它，只需检查
pos
（已设置为
window.pageYOffset
）的值即可。（事实上，我刚刚意识到默认情况下，
pageYOffset
会找到该名称的全局值，因此我的第一条评论实际上并不准确。但这段代码充其量还是多余的。）感谢您的帮助，这段代码显示并隐藏了按钮，但有一个问题是，当你点击按钮时，它只跳了1个像素，没有到达页面的顶部，不知怎的被卡住了。奇怪的是，它适合我。我还发现它是否可以帮助你是的，W3正在工作，并打算尝试这样做，但当你点击按钮时，它有即时速度，不知道如何降低速度，不得不询问Stackoverflow。是的，终于解决了，谢谢；）但是你能解释一下为什么你没有在“else”后面加“{”不应该像这样“}else{document.querySelector”或者你没有加括号是因为“'scroll'，（e）=>{”有一个括号打开了吗？@Behar-an
如果
或
else
块只包含一条语句，省略括号是合法的。（对于这是否是一种好的风格，意见不一，就我个人而言，我不喜欢它，但我不会对此感到太不安。）