iframe - bootstrap .modal 的 z-index 低于顶部淡入的 youtube iframe（仅在 Firefox 中）

Question

当引导程序从顶部淡入时，它会显示在 youtube iframe 嵌入视频的下方。一旦淡入淡出，它就会像它应该那样显示在顶部。我已将 wmodes 设置为透明，不透明将 fade 和 modal 上的 z 索引设置为高，但仍然没有运气。奇怪的是，这只发生在Firefox中。即 chrome 甚至是挑剔的 ipad 都可以正常工作！我怎样才能解决这个问题？！？

<div class="modal fade" id="test"> 
    <div class="modal-header"> <a class="close" data-dismiss="modal">&times;</a> <h3>You have already voted!</h3> </div> 
    <div class="modal-body"> <p>You may vote again tomorrow.</p> </div> 

</div>

Answer 1

在弄乱了 .modal.fade 上不透明度为 1.0 的引导程序的 css 之后，解决了这个问题：

    .modal.fade {
 opacity: 1.0;
  top: -25%;
   -webkit-transition: opacity 0.3s linear, top 0.3s ease-out;
     -moz-transition: opacity 0.3s linear, top 0.3s ease-out;
       -o-transition: opacity 0.3s linear, top 0.3s ease-out;
          transition: opacity 0.3s linear, top 0.3s ease-out;

}

如果有人能解释这会很好，不确定这如何只影响 Firefox。