Fancybox模式在iframe中不起作用

Question

Fancybox模式对话框在iPhone safari中不起作用！有什么原因吗？

<div class="m39-modal" data-component="m39-modal" id="modal_true"> 
    <button data-trigger="true" class="m39-modal__trigger">Modal Trigger</button> 
<div data-content="true" class="m39-modal__container" role="dialog" aria-expanded="false"> 
    <div class="m39-modal__dialog"> 
     <div class="m39-modal__header"> 
      <div class="m39-modal__title">Terms &amp; Conditions</div> 
      <button data-close="true" class="m39-modal__button--close">Close</button> 
     </div> 
     <div class="m39-modal__content"> 

       <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ut facilisis metus, varius elementum leo. Sed ut justo at magna pulvinar commodo non quis elit. Etiam cursus turpis sagittis sapien vulputate, sed sagittis nisi interdum. Suspendisse id neque non elit feugiat luctus. Aenean venenatis iaculis gravida. Nulla consectetur luctus neque ut fermentum. Fusce tellus risus, laoreet lacinia purus sed, tempor interdum nunc. </p><p>Phasellus in lorem justo. Ut rhoncus turpis at arcu dapibus, at lacinia lacus elementum. Donec elementum consectetur justo, non hendrerit augue dictum sit amet. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nam fringilla dui eget orci fermentum, vitae porttitor massa mollis. Duis luctus, eros quis vulputate convallis, sapien neque condimentum neque, vitae fermentum turpis sapien in ligula.</p><p>Phasellus iaculis odio a urna hendrerit, in iaculis odio ultricies. Nunc sed lacinia nulla. Vestibulum malesuada nunc id sapien volutpat luctus. Nam non fermentum metus. Nullam fermentum massa ut sem tristique, sed rhoncus leo vestibulum. Nullam egestas faucibus hendrerit. Duis risus felis, pulvinar eget risus in, dapibus varius metus. Vivamus turpis magna, sodales ut consequat at, auctor eu orci.</p> 

     </div> 
    </div> 
</div> 

可以检查你的iPhone Safari浏览器的代码，模态的对话中不工作，但在Android上它。 If you tried to enter this link through your iphone with safari browser http://molham.ae/m39-modal.html

如果您点击（05）号码弹出应该出现，如果你尝试从桌面浏览器它的工作。

Answer 1

我相当确定这个问题必须与Safari如何处理转换有关。你可以在iframe加载的页面中添加以下css规则，看看是否修复了错误？

.m39-modal .m39-modal__container, .m39-modal .m39-modal__dialog { -webkit-transition: opacity 0.1s; }