Chrome并不总是跳到 #top 而Firefox运行良好

Question

网站描述

我有一个页面，其中同时显示 10 个div的列表，而源文档中显示 100 个。底部是一个按钮，如果单击该按钮，该按钮将隐藏这 10 div并显示接下来的 10 div .按钮本身是一个样式链接，其中 id 属于我的navbar顶部的href="#top"。

问题

如果我使用 Chrome，它不会在每次单击按钮时跳到顶部。有时它会跳跃，有时它只是显示新的div，而没有跳到顶部。

什么有效

如果我使用火狐，那就没有问题了。

问题

我如何找出问题出在哪里 - 我的意思是，我的代码中的其他地方是否存在导致这种行为的错误（没有跳转到#top） - 或者是否有另一种方法可以告诉用户浏览器跳到我应该或可以使用的顶部？

Answer 1

与其使用锚点和指向它们的链接（因为您的锚点可能会改变位置，或者在浏览器之间的工作方式不同），不如使用 Javascript，使用 window.scrollTo() 函数：

.HTML

<button onclick="scrollToTop()">Go to Top</button>

爪哇语

function scrollToTop(){
    window.scrollTo(0, 0);
}

请注意，scrollTo() 采用两个参数：要滚动到的顶部和左侧位置。此外，scrollTo()没有动画，它将立即滚动到您设置的位置。