在 ES6 中可靠地确定全屏大小

Question

我的文档中有一个使用全屏 JS API div.fullscreenRequest() 缩放到全屏的文档。我发现全屏实际上只有在它被激活后才知道有多大，即触发了 fullscreenchange 事件。在这种情况下，我进行了一些计算（div 的原始大小与新的放大大小），因此我可以对 div 应用一些转换以使其看起来正确。

我遇到的问题是确定全屏尺寸非常不可靠。在 fullscreenchange 事件中，如果我确实检测到全屏模式已被激活，并且我分别使用 screen.width 和 screen.height，我有时会得到正确的值 (1920 x 1080)，但有时我会得到 1920 x 948没有明显的原因，非确定性的。似乎在屏幕仍在切换到全屏模式时，事件以某种活泼的方式触发？

确定全屏分辨率的可靠方法是什么？

Answer 1

这个呢：

const width = window.screen.width * window.devicePixelRatio,
      height = window.screen.height * window.devicePixelRatio;

console.log("screen size:", width + "x" + height);