Разный контент в Bootstrap рухнул navbar

Question

Я использую отзывчивый фиксированный навигатор в Bootstrap 2.3.

Есть ли способ иметь разные элементы в свернутой версии навигатора? Я знаю, что все, что находится в разделе

<div class="nav-collapse collapse"> 
</div> 

исчезнет, ​​когда свернет бар, но я хочу иметь разные вещи появляются в различных режимах панели.

Например, если длинная кнопка находится в полном режиме, но когда окно мало, я хотел бы иметь маленькую кнопку. Я могу поместить кнопку перед делением «крах коллапса», поэтому он будет отображаться в обоих режимах, но в обоих случаях он будет таким же.

Возможно, есть «событие коллапса», которое я мог бы подключить, когда бар рушится, а затем меняет свои элементы на лету?

Answer 1

Вы можете использовать адаптивные служебные классы, чтобы показать/скрыть различные кнопки ...

<div class="nav-collapse collapse"> 
     <button type="submit" class="btn hidden-tablet hidden-phone">Big Long Button</button> 
     <button type="submit" class="btn hidden-desktop btn-mini">Small</button> 
     <ul class="nav"> 
      <li class="active"><a href="#">Home</a></li> 
      <li><a href="#about">About</a></li> 
      <li><a href="#contact">Contact</a></li> 
     </ul> 
</div> 

Демо: http://bootply.com/92760