我有一个水平按钮组,我想要切换到垂直按钮组,屏幕尺寸是非常小的(-xs).有没有办法用Bootstrap 3类呢？
解决方法
使用
jquery来检测窗口大小并相应地调整菜单的类：
<div class="btn-group" id="responsive">
<button class="btn">Hello</button>
<button class="btn">World</button>
</div>
<script>
$(window).resize(function() {
if ($(window).width() < 408) {
$('#responsive').removeClass('btn-group');
$('#responsive').addClass('btn-group-vertical');
} else {
$('#responsive').addClass('btn-group');
$('#responsive').removeClass('btn-group-vertical');
}
});
</script>
使用纯粹的引导,您可以制作两个菜单：一个水平和一个垂直的菜单：
<div class="btn-group hidden-xs"> <button class="btn">Hello</button> <button class="btn">World</button> </div> <div class="btn-group-vertical visible-xs"> <button class="btn">Hello</button> <button class="btn">World</button> </div>
