IE中的模态不正确

Question

这个问题只存在于IE中，它在chrome

中工作正常

我有一个显示pdf文件的iframe：

<iframe src='myRoute/mypdf.com' width="100%" height="435px" id="PDF" name="PDF" title="Visor PDF" style="z-index:-1;" allowTransparency="true" wmode="opaque" frameborder="0">
</iframe>

它在IE中工作正常，但如果我是一个模态显示：

HTML:
   <div aria-hidden="false" aria-labelledby="myModalLabel" role="dialog" tabindex="-1" class="modal fade in" id="myModal" style="display: block;">
     <div class="col-xs-10 texto">
        <p>text alert</p>
     </div>    
     <button class="btn btn-primary" type="button" id="modalButton" data-dismiss="modal">Ok</button> 
   </div>

JS：

$('#myModal').modal("show");

CSS：

.modal {
  z-index: 99999;
  background-color: rgba(0,0,0,.5);
}

.fade.in {
   opacity: 1;
}

pdf文档不在模态之后，并且它的z-index大于模态的文件。

这个IE问题有什么解决方案吗？