2017-06-27 70 views
0

我在自舉模態窗體中面對一個錯誤,在窗體顯示正確後,我點擊按鈕,但該區域將顯示窗體正在阻止!它很難解釋你可以找到這裏的鏈接,我面臨一個問題Link hereBootstrap模態形式

現在,當你點擊快速查詢彈出將可見,但刷新頁面,並去服務和其他導航鏈接的區域越來越封鎖!

這裏是我的代碼提前

#modal_contact input[type="text"]{ 
 
\t width: 320px; 
 
\t max-width: 100%; 
 
\t padding: 16px 10px; 
 
\t border: 1px solid #828fac; 
 
\t border-radius: 5px; 
 
\t -webkit-border-radius: 5px; 
 
\t -moz-border-radius: 5px; 
 
\t -o-border-radius: 5px; 
 
\t color: #b6b7b8; 
 
\t font-size: 14px; 
 
\t font-family: helvetica; 
 
\t box-shadow: none; 
 
\t -webkit-box-shadow: none; 
 
\t -moz-box-shadow: none; 
 
\t -o-box-shadow: none; 
 
\t margin-left: 80px; 
 
} 
 

 
#modal_contact input[type="submit"]{ 
 
\t font-size: 14px; 
 
\t color: #fff; 
 
\t font-family: 'Noto Sans', sans-serif; 
 
\t text-transform: uppercase; 
 
\t background: #8248ac; 
 
\t padding: 20px 13px; 
 
\t border-radius: 6px; 
 
\t -webkit-border-radius: 5px; 
 
\t -moz-border-radius: 5px; 
 
\t -o-border-radius: 5px; 
 
\t border: none; 
 
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 

 
<li> 
 
\t \t \t \t \t \t \t  \t <div id="pks"><a href="#" data-toggle="modal" data-target="#myModal" style="text-decoration:none">QUICK ENQUIRY</a></div> 
 
\t \t \t \t \t \t \t  </li> 
 
        
 
        
 

 
<div class="modal fade" id="myModal" role="dialog"> 
 
<div class="modal-dialog"> 
 

 
    <!-- Modal content--> 
 
    <div class="modal-content"> 
 
    <div class="modal-header"> 
 
     <button type="button" class="close" data-dismiss="modal">&times;</button> 
 
     <h1 class="modal-title"><br><font size="6" color="#8348ac"><center>Have A Questions?</center></font><br></h1> 
 
    </div> 
 
    <div class="modal-body"> 
 
     <form id="modal_contact"> 
 
     Full Name : <input type="text" name="name" class="name" placeholder="Full Name"><br> 
 
     Email Id :&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" name="email" class="email" placeholder="Email address"><br> 
 
     Phone No : <input type="text" name="phone" class="email" placeholder="Phone no"><br> 
 
     Website : &nbsp;&nbsp;&nbsp;<input type="text" name="website" class="email" placeholder="Your Website"><br> 
 
     Questions : <input type="text" name="question" class="email" placeholder="Your Question??"> 
 
     <center><input type="submit" name="questions" value="Send Message"></center> 
 
     </form> 
 
    </div> 
 

 
    </div> 
 

 
</div> 
 
</div>

謝謝!

+0

是隻是我還是模態'div'不存在於服務頁面上。 – Steve

+0

模態代碼僅在索引頁面中可用。 –

+0

模式代碼僅在索引頁中存在 –

回答

0
<div class="modal fade" id="myModal" role="dialog"> 

這應該是默認隱藏的。

<div class="modal fade" id="myModal" role="dialog" style="display:none;">