Question

我想知道是否有办法显示当用户调整屏幕大小时更新的用户屏幕信息。我见过javascript只是显示用户的屏幕，但没有实时更新。有人知道这个脚本吗？谢谢！

Answer 1

两个想法：

resize上的window事件，但我怀疑浏览器不会触发屏幕尺寸更改（可能会这样做，但我认为）。如果它没有用户可能会在调整屏幕大小后重新调整窗口大小... Chrome屏幕分辨率发生变化时，至少不会触发resize浏览器窗口尺寸不大。有时更改屏幕分辨率会产生改变浏览器大小的连锁效应（例如，如果它需要更小，或者它是否以某种方式停靠），但通常不会。
如果浏览器无法可靠地触发resize（我怀疑他们不会），您必须轮询并检查screen对象看看尺寸是否改变了。不理想，但每秒一次左右的投票不会有太大的开销。

以下是使用这两种方法的示例，以及建议为GitaarLAB的window.onfocus：Live Copy

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Example</title>
</head>
<body>
<script>
  (function() {
    "use strict";
    var lastSize;

    window.onfocus = window.onresize = checkSize;

    setInterval(checkSize, 1000);

    function checkSize() {
      if (!lastSize || (lastSize.width !== screen.width || lastSize.height !== screen.height)) {
        lastSize = {
          width: screen.width,
          height: screen.height
        };
        display("Screen size is (now) " + lastSize.width + "x" + lastSize.height);
      }
    }

    function display(msg) {
      var p = document.createElement('p');
      p.innerHTML = String(msg);
      document.body.appendChild(p);
    }
  })();
</script>
</body>
</html>

当然，如果窗口上的通知调整大小且窗口焦点不够，您只需要轮询。

Answer 2

如何将函数绑定到window.onresize？

window.onresize = function (e) {
  console.log("Dimensions: " + e.target.outerWidth + "x" + e.target.outerHeight);
};

如何在调整大小时显示用户的显示器分辨率？

2 个答案: