Html 带响应iframe的Bootstrap 4模式

我试着用iframe做一个模态

<a href="#" data-toggle="modal" data-target="#exampleModal">
<img id="imageresource" src="http://www.justdeluxe.at/wordpress/wp-content/uploads/2019/01/nature-3048299_1920.jpg" style="width: 400px; height: 264px;"></a>  


          <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog" role="document">
              <div class="modal-body">
                  <iframe src="https://player.vimeo.com/video/80836225?badge=0" width="640" height="360" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe>
              </div>
            </div>
          </div>

我发现，当您删除

时，我的iframe完全响应。 问题是，我不能播放视频。因此，iframe在单击时没有响应

有人知道为什么吗

模态的原始代码如下所示：

情态标题
&时代；
...
接近
保存更改

不要删除

。模式内容

，而是覆盖其样式：

#exampleModal .modal-content {
    background: transparent;
    border: none;
}

---

示例：

替代删除

.modal content

，替代其样式：

#exampleModal .modal-content {
    background: transparent;
    border: none;
}

例如：