javascript - 仅在桌面上运行 window.addEventListener 而不是在移动或平板设备上运行

Question

我正在设置一个 htm5 画布作为覆盖整个屏幕的背景图形。目前 Canvas 图形在每次窗口改变大小时都会刷新，因此即使用户改变窗口尺寸，图形也可以在窗口边缘反弹。这适用于桌面，但不适用于移动/平板电脑，因为移动/平板电脑上的浏览器导航栏会导致画布在每次浏览器导航栏隐藏和出现时调整大小。我正在尝试找到一种方法使“window.addEventListener”仅在桌面上运行并在移动/平板电脑上被忽略。

  window.addEventListener("resize", sizeCanvas);
  sizeCanvas();

  function sizeCanvas(){
   canvas.width  = window.innerWidth;
   canvas.height = window.innerHeight - 55; 
   if(exampleRunning){  
     reset(); 
   }
  }

  var reset = function(){
   stars = [];
   FPS = 60; 
   if (canvas.width < 600) x = 16;
   if (canvas.width > 600) x = 22;
   if (canvas.width > 1200) x = 34;

   for (var i = 0; i < x; i++) {
    stars.push({
     x: Math.random() * canvas.width,
     y: Math.random() * canvas.height,
     radius: Math.random() * 4 + 1,
     vx: Math.floor(Math.random() * 50) - 25,
     vy: Math.floor(Math.random() * 50) - 25,
    });
   }
  }

标签： javascripthtml