首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >当导航回/向前时,浏览器滚动到以前的位置而不是锚点。

当导航回/向前时,浏览器滚动到以前的位置而不是锚点。
EN

Stack Overflow用户
提问于 2019-08-26 10:37:22
回答 1查看 1K关注 0票数 1

我正在构建一个纯HTML / CSS滑块(没有JS)。它运行得很好,参见代码

您需要下载并在本地执行它,以了解我的问题,因为它与浏览器的后退按钮和前向按钮有关。

当单击要导航的链接时,URL将更改为#a1、#a7、#a5,无论您在做什么。滑块正确滚动到适当的幻灯片。如果您手动更改URL,例如将#a3而不是#a7放置,滑块也将正确滚动。

但是,当您返回(或向前)时,将从#a3更改为#a7,但内容不会滚动

知道为什么吗?知道我能做些什么让卷轴在后面的动作吗?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-08-26 13:27:24

我问了一个Firefox开发人员,他向我解释了为什么这是预期的行为,而不是bug。

我误解了背后的行动是怎么回事。快速回答:-它不去之前选择的锚,它去的身体滚动是

仍在使用问题中代码页中的代码:

  • 从CSS中删除overflow-x: scroll
  • 点击#a3,然后点击#a7。内容滚动到#a7
  • 单击浏览器的“后退”按钮

我以为浏览器回滚到#a3。但是实际上,它正在滚动到点击链接之前的位置。看到它付诸行动:

  • 点击#a5。URL更改为#a5
  • 将滚动卷移动到屏幕上有#a3
  • 点击#a7。URL更改为#a7
  • 单击浏览器的“后退”按钮

URL更改为#a5 ,但#a3显示在屏幕上,因为在单击链接之前您就是这样做的。

因此,它是预期的行为等级库

然而,这不是I想要的行为。所以,让我们去做一个肮脏的黑客:

代码语言:javascript
运行
复制
window.onhashchange = function() {
  window.location.href = window.location.href;
};

现在,当单击back时,它将强制页面在本地重新加载(没有服务器请求),并滚动到元素。

哇,太难了。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/57656284

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档