2017-07-04 92 views
0

我遇到了bootstrap模式在Safari和iOS上不能正常运行的问题。我已经阅读了堆栈溢出中的类似问题,但在图像中找不到使用Modals的问题。有人可以提供一些见解和帮助吗?Bootstrap Modal在iOS中无法正常工作

<img alt="therapist" class="img-circle" data-target="#linda" data-toggle="modal" src="img/team/linda.png"> // modal opens when image is clicked 
<h3 class="team--name" data-target="#linda" data-toggle="modal">Linda</h3> 
<!-- Modal --> 
<div aria-labelledby="myModalLabel" class="modal fade" id="linda" role="dialog" tabindex="-1"> 
    <div class="modal-dialog" role="document"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button aria-label="Close" class="close" data-dismiss="modal" type="button"><span aria-hidden="true">&times;</span></button> 
       <h2 class="modal-title team--name" id="myModalLabel">Linda</h2> 
       <h4 class="team--name">CAMTC</h4> 
      </div> 
      <div class="modal-body"> 
       <p>Linda brings compassion, positive energy and balance into her clients' lives</p> 
      </div> 
      <div class="modal-footer"> 
       <button class="btn btn-success" data-dismiss="modal" type="button">Close</button> 
      </div> 
     </div> 
    </div> 
</div> 

我已经尝试在图像内部实现类没有用。

.clickable { 
    cursor: pointer; 
} 

回答

0

案例修复。

我已经添加了以下脚本以将模态添加到正文。

$(document).ready(function() { 
    $(".modal").appendTo("body"); 
});