如何關閉摺疊面板，當我們點擊bootstap面板內的鏈接

我試過這個鏈接解決方案，但無法得出結論..請幫助任何一個。我是新來this..tried一切，但都徒勞，我想這樣的事情該怎麼辦 check this如何關閉崩潰面板，當我們在bootstap單擊面板內部鏈接如何關閉摺疊面板，當我們點擊bootstap面板內的鏈接

我的代碼

  <body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="60"> 

     <nav class="navbar navbar-default navbar-fixed-top"> 
      <div class="container"> 

       <div class="navbar-header"> 
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
        </button> 

        <!-- ***** --> 
       <!-- <a href="#" class="btn btn-default" data-toggle="collapse" href="#collapse1"> 
        <i class="material-icons" style="font-size:53px;">menu</i> 
        </a> --> 
<!--     ****** --> 
<div class="navbar navbar-default navbar-static-" role="navigation"> 
    <div class="container"> 
     <button class="btn btn-default" data-toggle="collapse" data-target="#menu"><span class="material-icons" style="font-size:40px;">menu</span></button> 

    </div> 
</div> 
</div> 
<!-- Menu --> 
<div id="menu" class="panel panel-default panel-collapse collapse bottom padding"> 
    <div class="container collapse navbar-collapse" id="myNavbar"> 
    <ul class="bottom padding list-inline"> 
     <li><a href="#about" class="panel-collapse">ABOUT US</a>/</li> 
         <li><a href="#services" >SERVICES</a>/</li> 
         <li><a href="#portfolio">HOTELS</a>/</li> 
         <!--<li><a href="#pricing">PRICING</a></li>--> 
         <li><a href="#contact">CONTACT</a></li> 
    </ul> 
    <div class="container bottom padding"> 
    <div class="row"> 
    <div class="text-center"> 
     <p class="white">Some of our partner hotels</p> 
    </div> 
    </div> 
    <div class="row"> 
    <div class="col-sm-4"> 
     <div class="tile"> 
     <h3 class="title">Hilton Grosvenor House</h3> 
     <p>The definition of luxury</p> 
     </div> 
    </div> 
    <div class="col-sm-4"> 
     <div class="tile"> 
     <h3 class="title">Marriott</h3> 
     <p>Service paradise</p> 
     </div> 
    </div> 
    <div class="col-sm-4"> 
     <div class="tile"> 
     <h3 class="title">Ramada</h3> 
     <p>For the business traveller</p> 
     </div> 
    </div> 
    </div> 
</div> 
    </div> 
    <div class="text-center padding padding"> 
      <img src="images/TTB_Logo_small.png"/> 
      <h1>Tourists Travel Bureau UK Limited</h1> 
      </div> 
</div>

和JavaScript的

<script type="text/javascript"> 
      $(document).ready(function() { 
       $(document).click(function (event) { 
        var clickover = $(event.target); 
        var _opened = $(".navbar-collapse").hasClass("navbar-collapse in"); 
        if (_opened === true && !clickover.hasClass("navbar-toggle")) { 
         $("button.navbar-toggle").click(); 
        } 
       }); 
      });</script>

來源

2016-09-22 Elizabeth

我不知道我是否正確地得到了您的問題。你面臨的問題是什麼？你想關閉模式或打開它。不清楚 – Cyclotron3x3

當我點擊「關於我們」等鏈接時，我想關閉面板 – Elizabeth

你沒有使用js代碼嘗試嗎？ – bangde

要鏈接或按鈕給

data-target = "#idofthepanel"

請參閱面板使用ID而不是類

另外，您已經給了data-target =「＃mynavbar」，但navbar是一個類，而不是一個id。

來源

2016-09-22 06:25:04 bangde

navbar是一類，但mynavbar不是類ri8 ?? – Elizabeth

你在這裏粘貼的代碼，myNavbar是一個類。搜索myNavbar，你會看到一個div有這個類 – bangde

現在查看編輯後的代碼 – Elizabeth

如何關閉摺疊面板，當我們點擊bootstap面板內的鏈接

回答

相關問題