自适应

123 阅读1分钟
  mounted() {
    window.onresize = () => {
      this.adaptation();
    };
    this.$nextTick(function() {
      // 初始化dom相关数据
      window.onresize();

    });
    }
    
    methods(){
        adaptation() {
      var w = document.body.clientWidth;
      var h = document.body.clientHeight;
      var nw = 1920,
        nh = 1080;
      var left, top, scale;
      if (w / h > nw / nh) {
        scale = h / nh;
        top = 0;
        left = (w - nw * scale) / 2;
      } else {
        scale = w / nw;
        left = 0;
        top = (h - nh * scale) / 2;
      }
      document
        .getElementById("main")
        .setAttribute(
          "style",
          "transform: scale(" +
            scale +
            ");left:" +
            left +
            "px;top:" +
            top +
            "px;"
        );
      // document.getElementById('main').setAttribute('style', 'transform: scale('+ 1592/1920 +');left:'+0+'px;top:'+0+'px;');
    },
    }