javascript - 根据浏览器大小定位元素

Question

我有一个关于在屏幕上定位元素的问题。当我启动我的程序时，它会计算浏览器的宽度和高度的一半。我只在开始时这样做。所以我的水平滚动条位于中心，但是当我在程序运行期间更改浏览器大小时，它当然不会位于中心。我怎样才能做到这一点？

我对宽度和高度的计算：

  function GetWidth()
{
      var x = 0;
      if (self.innerHeight)
      {
              x = self.innerWidth;
      }
      else if (document.documentElement && document.documentElement.clientHeight)
      {
              x = document.documentElement.clientWidth;
      }
      else if (document.body)
      {
              x = document.body.clientWidth;
      }
      return x;
}
function GetHeight()
{
      var y = 0;
      if (self.innerHeight)
      {
              y = self.innerHeight;
      }
      else if (document.documentElement && document.documentElement.clientHeight)
      {
              y = document.documentElement.clientHeight;
      }
      else if (document.body)
      {
              y = document.body.clientHeight;
      }
      return y;
}

Answer 1

希望这会对您有所帮助：媒体查询 CSS

阅读这些内容，我用它来在手机、平板电脑和台式机之间显示和控制我的内容。

它非常手，易于使用。

Answer 2

使用onresize-event重新调整您的 gui。

function resize() {
  // do something here
}

window.onresize = resize;