Customloading屏幕仅覆盖一半场景

Question

我在使用自定义加载屏幕时遇到问题。当我显示加载屏幕时，它仅覆盖一半场景：加载时的图像1

这是我用来显示加载屏幕的代码：

BABYLON.DefaultLoadingScreen.prototype.displayLoadingUI = function() {
    if (document.getElementById("customLoadingScreenDiv")) {
      document.getElementById("customLoadingScreenDiv").style.display =
        "initial";
      return;
    }

    this._loadingDiv = document.createElement("div");
    this._loadingDiv.id = "customLoadingScreenDiv";
    this._loadingDiv.style.color = "white";
    this._loadingDiv.style.height = "1000px";
    this._loadingDiv.style.width = "100%";
    this._loadingDiv.style.alignContent = "center";
    this._loadingDiv.style.marginTop = "-50%";
    var img = new Image();
    img.src = "[link to gif]";
    img.style.position = "center";
    this._loadingDiv.appendChild(img);

    this._resizeLoadingUI();
    window.addEventListener("resize", this._resizeLoadingUI);
    document.body.appendChild(this._loadingDiv);
  };

  BABYLON.DefaultLoadingScreen.prototype.hideLoadingUI = function() {
    document.getElementById("customLoadingScreenDiv").style.display =
      "none";
  };

我的错是什么？

Answer 1

我会说，这实际上是CSS问题，而不是您标记问题的任何标签。

我的解决方法是：

this._loadingDiv.style.color = "white";
this._loadingDiv.style.height = "100vh";
this._loadingDiv.style.width = "100%";