Bootstrap媒体查询转换

Question

我有一个侧边栏和主要内容，可以在滑动时在两个引导网格类之间切换。我想应用CSS过渡来使滑动动作流畅。

$scope.openSidebar控制侧边栏的状态，从而控制部分的宽度

<section class="middle col-xs-12 rh100" ng-swipe-right="toggleSidebar()" ng-swipe-left="toggleSidebar()" >

    <section class="left col-sm-3" ng-class="{'open': openSidebar, 'col-xs-4': openSidebar, 'hidden': !openSidebar}">
    </section>

    <section class="main col-sm-9" ng-class="{'open': openSidebar, 'col-xs-8': openSidebar, 'col-xs-12': !openSidebar}">
    </section>

</section>