加载器淡出页面后总是滚动回顶部（我不想）答案

【问题标题】：After loader fades out page always scrolls back to top (and I don't want to)加载器淡出页面后总是滚动回顶部（我不想）
【发布时间】：2020-08-14 21:13:42
【问题描述】：

我担心我的问题有点愚蠢，但我多年来一直有这个问题，我决定我会问。我正在使用一个覆盖整个页面的 div。它是打开 body 标签后的第一个元素。我通常会在里面放一些旋转元件，然后输入“正在加载...”。我正在使用简单的脚本在页面加载后淡出这个 div。这是简化的代码：

HTML

<!DOCTYPE HTML>
<html>
<head>
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
    <div class="loader">
    </div>
<!-- All the content of the page goes here -->
</body>
</html>

CSS

.loader {
   position:fixed;
   height:100%;
   width:100%;
   background: white
   z-index:99999;
}

JavaScript

$(window).on('load', function() {
    $(".loader").fadeOut("slow");
});

它工作正常。但是当您转到带有锚点的页面（例如“www.mysite.com/index.html#someanchor”）时，就会出现我的问题。我看到滚动条在正确的位置，“.loader” div 在页面完全加载时位于所有内容之上，然后在“.loader”突然消失后页面立即滚动回顶部。如果您在页面中间并按 F5（或刷新按钮），也会发生同样的情况 - 页面重新加载（我可以看到滚动条保持在我一直到那一刻的位置）并且在加载器消失后它突然回到最佳。有没有办法避免这种情况？我已经搜索了很多类似的问题，我尝试过设置超时，尝试添加类，但仍然没有找到解决此问题的方法。

【问题讨论】：

我无法复制这个。您是否在页面上运行其他脚本？
@charles 实际上很多 :( 这是一个现场示例：dedopene.com
这很激烈。看起来你懒加载了很多内容。如果是这种情况，则锚点可能在页面下方不够远，无法对滚动位置产生影响，直到所有图像都到位。如果是这种情况，当加载器消失时，页面将不会滚动到锚点或用户之前的滚动距离。

标签： javascript html jquery dom

【解决方案1】：

好的，这很尴尬，但感谢 Charles Bamford（他问：“你在页面上运行其他脚本吗？”）我发现 Modernizr 导致了这个问题。我不确定这个问题对任何人都有用，所以我正在考虑删除它......

【讨论】：