Navbar는 부트 스트랩에서 내 모달을 호출 할 때까지 클릭하지 않습니다.

Question

부트 스트랩 (v2.3.2)을 사용합니다. 내 navbar입니다;

<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> 

그리고 나는이 같은 내 caraousel에 버튼이 있습니다;

<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"또는 "리"태그를 클릭 할 수 없습니다. 드롭 다운 메뉴가 열리지 않습니다.하지만 내 모달을 호출 한 다음 닫습니다. 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> 

는

Answer 1

<div class="modal fade hide" id="mapmodals"> 

</div> 

나는 그것을 해결! 내 모달 클래스에 "hide"속성을 추가합니다.