有没有办法防止浏览器缓存滚动位置和缩放级别等值

Is there a way to prevent browsers from caching values like scroll position and zoom level?

本文关键字：缩放 位置 滚动 缓存 浏览器 有没有      更新时间：2023-09-26

我正在设计一款完全在浏览器中进行的交互式网络游戏。它使用了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. */
});

我通过将其css position属性设置为fixed，将隐藏元素一起排除在html流之外，从而解决了我的问题。我通过使用一些自定义触摸事件处理程序更改元素style.left值来模拟页面滚动。页面不需要通过添加屏幕外元素来调整大小或缩放，因为固定位置元素不会影响布局。

然而，这并不能回答我关于重置缩放级别的问题，我仍然希望任何人都能有所了解。

相关文章：