模態框不彈出

Question

如何使用此圖像打開模式框？

<div class="grid"> 
      <figure class="effect-apollo"> 
       <a href="#modal-ef" role="button" data-toggle="modal"> 
        <img src="http://i.imgur.com/KDlptL.png"> 
       </a> 
       <figcaption> 
        <h2>Strong <span>Apollo</span></h2> 
        <p>Apollo's last game of pool was so strange.</p> 
       </figcaption>   
      </figure> 
     </div> 

我試圖使用圖像作爲鏈接，但沒有解決。 本身看起來像這樣的模式：

<div id="modal-ef" class="modal"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <span class="close">&times;</span> 
        <h2></h2> 
       </div> 
       <div class="modal-body"> 
        <!--<div class="avatar"> 
         <img src="http://i.imgur.com/DsekuY7.gif alt="" /> 
        </div>--> 
        <p></p> 
       </div> 
       <div class="modal-footer"></div> 
      </div> 
     </div>  

Answer 1

我覺得你應該把IMG和figcaption的<一>裏，就像這樣：

<div class="grid"> 
       <figure class="effect-apollo"> 
        <a class="modal-button" data-content="ef"> 
         <img src="#"> 
         <figcaption> 
          <h2>Strong <span>Apollo</span></h2> 
          <p></p> 
         </figcaption> 
        </a>   
       </figure> 
      </div>