2017-05-29 4 views
0

小さなデバイスでページにアクセスすると、ドロップダウンメニューの通常のメニューからどのように移行できますか?私のコードはこのようなものですが、それは反応的ですが、この種のメニューを実装する方法はわかりません。私はその「ハンバーガーメニュー」を載せたいと思っていました。ドロップダウンメニューのメニューを変換する

シモンズ:私は

HTMLが更新されたHTMLを変更することはできません。

<div id="pai" class="row"> 
    <div class="col-xs-12 col-xs-10"> 
    <div class="menu"> 
    <nav> 
    <div class="navbar-default" style="background-color: rgba(249,211,0,1.00);"> 
     <div class="container-fluid"> 

      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
    </button> 

     <div class="collapse navbar-collapse" id="navbar-collapse"> 
     <ul id="menu" class="nav navbar-nav"> 
      <li class="LogoPosicao"> <img class="img-responsive" id="imagemBBlogo" src="BBomParaTodos.png" alt="Banco Do Brasil Logo"> </li> 
      <li><a class="Entenda" href="#" visibility="hidden">ENTENDA</a></li> 
      <li><a class="SemJuros" href="#" visibility="hidden">SEM JUROS</a></li> 
      <li><a class="Quebra">|</a></li> 
      <li id="telefoneC"><a class="tel" href="#"> <span class="glyphicon glyphicon-earphone"></span> (99) 9999-9999</a></li> 
      <li id="contatoLI"><a class="Contato" href="#Contato-Site" button type="button" data-toggle="button" aria-pressed="false" autocomplete="off">CONTATO</a></li> 
     </ul> 
     </div> 
     </div> 
    </div> 
    </nav> 
    </div> 

</div> 
+0

は、なぜあなただ​​けのブートストラップ折り畳み式のnav https://getbootstrap.com/components/#navbar –

+0

を使用していない私は、HTMLを変更せずにそれを行う方法を知っていると私はありません本当にデスクトップのレイアウトを変更することはできません – Lucky

+0

あなたはhtmlを追加することはできません? –

答えて

0

はちょうどそれをやりました。

<div id="pai" class="row"> 
    <div class="col-xs-12 col-xs-10"> 
    <div class="menu"> 
    <nav> 
    <div class="navbar-default" style="background-color: rgba(249,211,0,1.00);"> 
     <div class="container-fluid"> 

      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
    </button> 

     <div class="collapse navbar-collapse" id="navbar-collapse"> 
     <ul id="menu" class="nav navbar-nav"> 
      <li class="LogoPosicao"> <img class="img-responsive" id="imagemBBlogo" src="BBomParaTodos.png" alt="Banco Do Brasil Logo"> </li> 
      <li><a class="Entenda" href="#" visibility="hidden">ENTENDA</a></li> 
      <li><a class="SemJuros" href="#" visibility="hidden">SEM JUROS</a></li> 
      <li><a class="Quebra">|</a></li> 
      <li id="telefoneC"><a class="tel" href="#"> <span class="glyphicon glyphicon-earphone"></span> (99) 9999-9999</a></li> 
      <li id="contatoLI"><a class="Contato" href="#Contato-Site" button type="button" data-toggle="button" aria-pressed="false" autocomplete="off">CONTATO</a></li> 
     </ul> 
     </div> 
     </div> 
    </div> 
    </nav> 
    </div> 

</div> 
関連する問題