導航欄不要點擊，直到我在Bootstrap中調用我的模態

Question

我使用Bootstrap（v2.3.2）。我的導航欄是;

<div class="navbar-wrapper"> 
     <div class="container"> 
      <div class="navbar navbar-inverse"> 
       <div class="navbar-inner"> 

        <button type="button" class="btn btn-navbar" data-toggle="collapse" 
         data-target=".nav-collapse">  
        </button> 

        <a class="brand" href="index.jsp">MyPage</a> 
        <div class="nav-collapse collapse"> 


         <ul class="nav"> 
          <li class="active"><a class="brand" href="index.jsp">Home</a></li> 
          <li><a class="brand" href="about.html">About</a></li> 
          <li><a class="brand" href="rm.jsp" >Contact</a></li> 

          <li class="dropdown"><a class="brand" href="#" class="dropdown-toggle" 
           data-toggle="dropdown">Menü <b class="caret"></b></a> 
           <ul class="dropdown-menu"> 
            <li><a href="Gallery.jsp" target="_blank">Gallery</a></li> 
            <li><a href="m.jsp" target="_blank">Some page</a></li> 
            <li><a href="k.jsp" target="_blank">Guest Book</a></li> 


           </ul> 
      </li> 
         </ul> 

         <div style="display: inline-block; margin-top:5px ;margin-left:520px;"> 

         </div> 


         <a target="_blank" href="https://www.facebook.com/groups/bademdere/" class="btn btn-social-icon btn-facebook pull-right"> 
          <i class="fa fa-facebook"></i> 
         </a> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 

而且我有這樣一個按鈕在我的開胃菜上;

<p><a href="#mapmodals" role="button" data-toggle="modal" class="btn btn-large btn-primary">Show on map</a></p> 

，我的模態是;

<div class="modal fade" id="mapmodals"> 
     <div class="modal-dialog"> 
      <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
       <h4 class="modal-title" id="myCity">MyPage</h4> 
      </div> 
      <div class="modal-body"> 
       <div id="map_canvas" style="width:530px; height:300px"></div> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="close" data-dismiss="modal">Close</button> 
      </div> 
     </div> 
    </div> 
    </div> 

當網站第一次打開時，我無法點擊「ul」或「li」標籤。下拉菜單不開。但我打電話給我的模態，然後關閉它，我可以完全點擊導航欄。下拉菜單是開放成功。

我嘗試在navbar上面定義模式，它不會改變。

我該如何解決這個問題？ 一個例子是這裏：http://www.bootply.com/gQZPPqbmcS

編輯：我的caraousel代碼是;

<div id="myCarousel" class="carousel slide"> 
     <div class="carousel-inner"> 
      <div class="item active"> 
       <img src="img/slide-01.jpg" alt=""> 
       <div class="container"> 
        <div class="carousel-caption"> 
         <h1>Wellcome</h1> 
         <p class="lead">Some text <br> some text</p> 
        </div> 
       </div> 
      </div> 
      <div class="item"> 
       <img src="img/slide-02.jpg" alt=""> 
       <div class="container"> 
        <div class="carousel-caption"> 
         <h1>Loacation</h1> 
         <p class="lead">Some text.</p> 


          <!-- Button to trigger modal --> 
          <p><a href="#mapmodals" role="button" data-toggle="modal" class="btn btn-large btn-primary">See on map</a></p> 

        </div> 
       </div> 
      </div> 
      <div class="item"> 
       <img src="img/slide-03.jpg" alt=""> 
       <div class="container"> 
        <div class="carousel-caption"> 
         <h1 style="color: #000000;">text</h1> 
         <p class="lead" style="color: #000000;">Some text</p> 
         <a class="btn btn-large btn-primary" 
          href="y.jsp" 
          target="_blank">text</a> 
        </div> 
       </div> 
      </div> 
     </div> 
     <a class="left carousel-control" href="#myCarousel" data-slide="prev">&lsaquo;</a> 
     <a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a> 
    </div> 

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.