У меня есть выпадающее меню в панели навигации, но в нем есть несколько подпунктов.Это нормально на большом экране, но когда навигация свернута, они не настолько важны, чтобы занимать всю комнату, которую занимают.
Есть ли способ закрыть раскрывающийся список, когда он свернут, или удалить раскрывающийся список и подпункты и заменить его тегом привязки (где он перейдет на страницу, где пользователь может выбрать этот подпункт)?Или я думаю об этом все неправильно?
<!-- Navbar -->
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<!-- .btn-navbar is used as the toggle for collapsed navbar content -->
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="/">mybrand</a>
<div class="nav-collapse">
<ul class="nav">
<li<{if $contenttemplate == "option1"}> class="active" <{/if}>><a href="/">option1</a></li>
<li<{if $contenttemplate == "option2"}> class="active" <{/if}>><a href="/option2">option2</a></li>
<li<{if $contenttemplate == "option3"}> class="active" <{/if}>><a href="/option3">option3</a></li>
<li<{if $contenttemplate == "dropdown"}> class="dropdown active" style="background-color:rgba(0,0,0,0.5);"
<{else}> class="dropdown"<{/if}>>
<a class="dropdown-toggle" data-toggle="dropdown" href="#">lists<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="/lists/number1">number1</a></li>
<li><a href="/lists/number2">number2</a></li>
<li><a href="/lists/number3">number3</a></li>
<li><a href="/lists/number4">number4</a></li>
</ul>
</li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
</div>