如何解决载入程序淡出后,页面始终会滚动回到顶部我不想
我担心我的问题有点愚蠢,但多年来我一直遇到这个问题,所以我决定问问。我正在使用一个覆盖整个页面的div。这是打开body标签后的第一个元素。我通常在其中放一些旋转元素,然后键入“ loading ...”。页面加载后,我正在使用简单的脚本淡出该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 Bamford(他问:“您是否在页面上运行其他脚本?”),我发现Modernizr导致了这个问题。我不确定这个问题对任何人都有用,所以我正在考虑删除它...
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。