bootstrap 如何隐藏左边菜单栏

Question

下面代码是一个模板页面，bootstrap如何控制点击按钮，左边菜单栏隐藏，右边内容自动扩大

     <!-- topbar ends -->
<div class="ch-container">
    <div class="row">


        <!-- left menu starts -->
        <div class="col-sm-2 col-lg-2" style="padding-left:0px;padding-right:0px;">
            <div class="sidebar-nav">
                <div class="nav-canvas">
                    <div class="nav-sm nav nav-stacked">

                    </div>
                    <ul class="nav nav-pills nav-stacked main-menu">
                        <li class="nav-header">#springMessage("main")</li>
                        #menubar($!{menus},$selectedMenu)
                    </ul>
                </div>
            </div>
        </div>
        <!--/span-->
        <!-- left menu ends -->

        <noscript>
            <div class="alert alert-block col-md-12">
                <h4 class="alert-heading">Warning!</h4>
                <p>You need to have <a href="http://en.wikipedia.org/wiki/JavaScript" target="_blank">JavaScript</a>
                    enabled to use this site.</p>
            </div>
        </noscript>
        <div id="content" class="col-lg-10 col-sm-10"  style="margin-top:10px">
           $screen_content   
        </div>
</div><!--/fluid-row-->

Answer 1

用JS 吧 我这有快代码你瞅瞅，或许有用
main 是右侧内容块
#list_left是左侧菜单
closeMenu>span 是点击按钮

    var moveLeft = $("#list_left").width();
    $(".main").css({marginLeft:moveLeft});
    var isShow = true;
    $(".closeMenu span").click(function(){
            $(this).hide().siblings().show();
            if(isShow){
                    $("#list_left").animate({
                            marginLeft : - (moveLeft-15)
                    },200,"linear",function(){
                            isShow = false;
                            $(".closeMenu > span").css({
                                    opacity:1
                            });
                    });
                    $(".main").animate({margin:"0 auto",marginLeft:15},"linear");
            }else{
                    $("#list_left").animate({
                        marginLeft : 0
                    },200,"linear",function(){
                            isShow = true;
                    });
                    $(".main").animate({marginLeft:moveLeft},"linear");
            }
    });