twitter-bootstrap - style - collapse bootstrap

Alternar la barra lateral en el dispositivo móvil con Twitter Bootstrap 2.x

Question

¿Es posible, mediante Bootstrap, ocultar la barra lateral de los dispositivos móviles, pero dejarla accesible mediante el botón de alternar? El botón de alternar solo debería mostrarse para el dispositivo móvil, donde la vista predeterminada no tiene barra lateral, similar a cómo funciona la barra de navegación Bootstrap. Ver gráfico adjunto.

Answer 1

ejemplo que usa la clase de respuesta de bootstrap y dos eventos de jquery onclick: http://bootply.com/62828

html

<div class="container">
<div class="row">
    <div class="span9" id="content" style="background-color:blue;">
<div class="navbar visible-phone">
<div class="container">
      <a class="btn btn-navbar" id="showsidebar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </a>
</div>
</div>      
        <p>Main column</p>
        <p>Content...</p>
    </div>
    <div class="span3 hidden-phone" id="sidebar" style="background-color:darkgreen;">

<div class="navbar visible-phone">
<div class="container">
      <a class="btn btn-navbar" id="showcontent">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </a>
</div> 
</div>      
        Sidebar
        </div>
</div>  
</div>  

javascript

$(''#showsidebar'').click(function(){
    $(''#sidebar'').removeClass(''hidden-phone'');
    $(''#content'').addClass(''hidden-phone'');

    }
);
$(''#showcontent'').click(function(){
    $(''#sidebar'').addClass(''hidden-phone'');
    $(''#content'').removeClass(''hidden-phone'');

    }
);