通过浏览器“返回”或链接返回从其他页面导航回来时保留滚动位置?

时间:2011-04-18 17:11:06

标签: php ajax navigation scroll state

我在维护滚动条位置时遇到了一些问题。

背景
我的一个页面中有一个水平图像浏览器。它延迟加载其图像,因此它可能会滚动数千个图像。单击每个图像时,它会将您带到包含放大图像和一些元数据的详细信息页面。在此页面中,您还可以按照在滚动条中看到的顺序直接移动到其他详细信息页面。

编辑:澄清
有一个带有溢出的HTML元素的页面:auto和滚动条。这个元素的内容非常非常长。当您离开然后返回此页面时,我希望滚动条能够记住您正在查看的最后一个位置。

目标
我想要做的是允许用户使用滚动条返回页面,而不是每次都重置到滚动条的开头。如果您使用浏览器的“后退”按钮,则此功能会自动生效,但当您使用我的显式链接返回搜索/浏览结果时,您每次都会从头开始。 (此外,一旦人们从详细页面导航到详细页面几次,浏览器的“后退”按钮就变得不太可行了。)

避免的方法
我之前的尝试在所有页面之间提交了一个表单,将滚动条位置保存在$ _POST var中,但是当你想使用后退按钮时,你会得到那个令人烦恼的弹出窗口,要求你确认,所以我想远离那个。

我也不想把它放到$ _GET对象中,因为这会通过让多个url指向同一页面而弄乱页面的SEO。

问题
您认为实施此方法的最佳方式是什么?

  • 我应该在window.history中使用一些聪明吗?
  • 我是否应该将带有滚动位置的AJAX请求发送到将该值存储在$ _SESSION对象中的脚本?
  • 别的什么?

提前感谢您的建议。

-K

1 个答案:

答案 0 :(得分:0)

我最终使用的解决方案是在每个详细信息页面中设置一个具有唯一元素id的会话var,然后在浏览页面中读取该会话var并使用偏移直接滚动到上次检查的元素详细页面。