Html 使用iframe作为背景而不禁用鼠标手势/事件

因此，我制作了一个小的dat.GUI应用程序，我想在我的网站上用作背景，但当我插入它时，它要么没有使用正确的维度，要么它禁用了鼠标事件（在本例中是鼠标单击）。这就是我现在使用的：

CSS:

我希望你们能帮我。如果有帮助的话，我正在尝试的网站是

提前谢谢

/* The container that contains text & buttons (this needs to be clickable as well */
.hero > .container {
  margin: 1em 0;
  height: auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  height: 60vh; 
    z-index: 2;
    top: 0;
    left: 0;
    overflow: auto;
    position: absolute;
}

/* The iframe itself */
iframe { 
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 60vh;
}