BootstrapのResponsive表示で常にメニューを開く
Responsiveデザインで表示したとき、ナビゲーションのメニューを開くボタンが小さすぎて押せないでござる。
現時点のBootstrapでは実装されてないようなので、pre-openをやっつける。
responsiveであるかは、widthを確認するしかない。
$(function() { var is_responsive = function(width) { return width <= 980; } if (is_responsive($(window).width())) { $(".btn.btn-navbar").click(); // *1 } $(window).resize(function() { if (is_responsive($(this).width())) { $(".btn.btn-navbar.collapsed").click(); // *2 } }); });
表示したばかりだと、メニューが閉じていても class="collapsed
が付かないので resize
したときとは異なるセレクタを指定しなくてはいけない。
というか、閉じていたら常に class="collapsed
がついていて欲しいでござる。コポォ。