我刚访问这个页面
http://www.elmastudio.de/和想知道是否可能建立左侧边栏折叠与Bootstrap 3。
@H_502_2@从顶部合拢侧边栏的代码(仅限手机)：
<button type="button" class="navbar-toggle sidebar-toggle" data-toggle="collapse" data-target=".sidebar-ex1-collapse">
<span class="sr-only">Sidebar</span>
<span class="glyphicon glyphicon-check"></span>
</button>
@H_502_2@Sidebar本身有hidden-xs类。它用以下js删除
$('.sidebar-toggle').click(function(){
$('#sidebar').removeClass('hidden-xs');
});
@H_502_2@如果单击按钮，则从顶部切换侧边栏。很高兴看到边栏的行为像上面的网站显示。任何帮助是赞赏！
解决方法
是的，这是可能的。这个例子应该有助于你开始..
@H_502_2@http://bootply.com/88026
@H_502_2@基本上，您需要将布局包装在外部div中，并使用媒体查询在较小的屏幕上切换布局。
/* collapsed sidebar styles */
@media screen and (max-width: 767px) {
.row-offcanvas {
position: relative;
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
}
.row-offcanvas-right
.sidebar-offcanvas {
right: -41.6%;
}
.row-offcanvas-left
.sidebar-offcanvas {
left: -41.6%;
}
.row-offcanvas-right.active {
right: 41.6%;
}
.row-offcanvas-left.active {
left: 41.6%;
}
.sidebar-offcanvas {
position: absolute;
top: 0;
width: 41.6%;
}
#sidebar {
padding-top:0;
}
}
@H_502_2@此外，还有几个more Bootstrap sidebar examples here