jquery - How to tell if the navbar is collapsed in order to toggle items in the navbar list -
i want to:
- display image - if menu extended
- display text - if menu collapsed (when "3 lines button" appears)
here code:
<nav class="navbar navbar-idebaca navbar-fixed-bottom"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#"><img src="img/iebaca.png"></a> </div> <div class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li> <img ng-show="somethingt catch if menu collapsed" src="img/button-aree.png"> <a id="areelink" href="#" ng-hide="somethingt catch if menu collapsed" ng-click="sendmessage('')">aree</a> </li> </ul> </div> </nav>
i think want bootstrap's responsive utility classes.
the hidden-sm
class hide element on small screens.
the visible-sm-block
, visible-sm-inline
, visible-sm-inline-block
classes show element only on small screens.
Comments
Post a Comment