当重新加载页面时，它会跳转到顶部，使用turbolinks和隐藏在html和body上的溢出

Question

我在Rails 5.1.4上有一个项目。正如在这个问题的标题中所说，重新加载页面会导致它跳到它的顶部。但我希望页面保持在重新加载之前的相同位置。在我的css我有这些风格：

html {
  overflow: hidden;
}

body {
  overflow-x: hidden;
}

如果我评论它们，turbolinks的行为就像我需要的那样。是否有任何方法可以保留这些样式并在页面重新加载后强制turbolinks保持在同一位置？谢谢。

Answer 1

正如我在评论中所说，Turbolinks的工作方式会影响浏览器加载.js文件的方式。

这是因为为新页面加载了所有js / css / html文件，但由于Turbolinks缓存了所有这些文件，因此重新加载页面时.js文件不会再次处理。因此，您可能有一个影响页面中.css的.js文件（可能是一个插件）。

解决此问题的一种方法是在加载页面时始终呈现受.js影响的元素。你可以通过JavaScript做到这一点。

Answer 2

这不是Turbolinks的问题，而是默认情况下浏览器的行为方式。浏览器在导航之前存储文档的滚动位置，以便在重新加载或导航时可以恢复它。 （Turbolinks复制了这种行为。）

通过将overflow: hidden;应用于html元素，无法滚动文档元素，因此滚动位置始终为0.使用该CSS，它是body元素实际上是滚动而不是文档。

为了证明这一点，这里有一个带有CSS的非turbolinks页面：http://output.jsbin.com/mikopor请注意，如果向下滚动并刷新，页面将返回到顶部。

如果可能，我建议删除html { overflow: hidden; }。

希望有所帮助