有没有一种方法可以防止浏览器缓存滚动位置和缩放级别等数值？

Question

我正在设计一个完全在浏览器中进行的交互式网络游戏。它使用了HTML5，所有元素都是游戏世界的一部分。因此，我需要对我的元素位置、滚动位置、缩放等拥有相当严格的控制。

其中一个特定的层级需要将一个元素放置在屏幕外（视口之外），以便用户必须滚动页面才能找到它。不幸的是，在滚动后，页面似乎记录了包括未看到的元素在内的新页面宽度。当刷新页面时，缩放级别会调整以适应整个屏幕并将隐藏的元素带入视口。这暴露了谜题并破坏了该层级。

我知道浏览器会存储诸如滚动位置之类的信息，以便用户重新访问页面时可以继续上次的进度。这对某些事情很好，但对我来说很糟糕。有没有办法防止浏览器缓存我的行为？有没有办法使用JavaScript获取或设置页面的缩放级别？

目前，我正在使用以下代码在用户离开页面之前重置滚动位置。它运作得很好，但用户可以看到页面在离开前滚动。

window.addEventListener("beforeunload",function(event_){
    window.scrollTo(0,0);
    /* What I would love is if there were a way to do this: */
    // window.zoomTo(1.0);
    /* But I'm sure that's asking for too much. */
});

- Frank

Answer 1

我通过将隐藏元素的CSS position属性设置为fixed，完全将其从HTML流中排除，成功解决了我的问题。我通过一些自定义触摸事件处理程序来改变元素的style.left值，模拟页面滚动。由于固定位置元素不影响布局，因此添加屏幕外元素后，页面无需调整大小或缩放。

然而，这并没有回答我的关于重置缩放级别的问题，我仍然非常感谢任何人可能有的见解。

- Frank