WEBFLOW的HTLM/CSS解决方案-在点击后退按钮后重新加载网站后,在Safari中保持滚动位置

92vpleto  于 2023-08-09  发布在  其他
关注(0)|答案(1)|浏览(132)

我不是一个专业的编码/程序员,因此我目前陷入了一个问题,而我的网站上的Webflow工作。
我有一个博客类型的网站,主页是一个提要,在那里我的团队和我上传我们的博客帖子,这是一个很长的列表,全天更新多次。我想开始,是一个解决方案,其中网站重新加载后,一个按下后退按钮在浏览器中,在阅读了一篇文章,并希望返回饲料-我现在遇到了一些问题,有关滚动位置在某些浏览器.
我目前的解决方案,我包括在一节(头代码,)是这样的:

<script>
(function () {
    window.onpageshow = function(event) {
        if (event.persisted) {
            window.location.reload();
        }
    };
})();
  </script>

字符串
上面的代码在按下后退按钮后重新加载网站时工作得很好。
问题:可悲的是,什么不工作,特别是在Safari浏览器,在iPhone,Mac等。是滚动位置的保持。每当用户返回提要时,在重新加载网站后,滚动位置将返回到页面的开头。
我希望有一个简单的解决方案来解决这个问题,一段代码,我可以实现到Webflow的自定义代码部分,保留滚动位置,即使在Safari。
如果这个社区有人能找到解决办法,我会很高兴。
谢谢你,Getty

uqzxnwby

uqzxnwby1#

。下面是一段代码,您可以在Webflow的自定义代码部分中实现,以保留滚动位置,即使在Safari中也是如此:

window.onpageshow = function(event) {
  if (event.persisted) {
    window.location.reload();
    var scrollY = window.scrollY;
    window.scrollTo(0, scrollY);
  }
};

字符串
这段代码将首先检查在按下后退按钮后是否正在加载页面。如果是,代码将重新加载页面并滚动到上一个滚动位置。

相关问题