我想在单击按钮时从右侧进入一个列窗格。该列将完全在屏幕外开始,并在页面中间停止。到目前为止,我已经尝试过类似的事情:

<div class="col-sm-6 col-sm-offset-12">


以及单击按钮时将调用的此javascript:

$("#previewPane").toggleClass("col-sm-offset-12");


我现在的问题是我无法完全将PreviewPane放在页面的一侧。将我的专栏偏移12并不能将其向右推到足以完全将其移出屏幕。引导程序中是否有任何方法可以允许我执行此操作?

最佳答案

我一直都这样做。 BS3已经打包了。

http://getbootstrap.com/examples/offcanvas/

您可以将触发按钮放置在任意位置。确保在打开抽屉时单击它。

要获得所需的全宽抽屉效果,请更改一些默认的BS3样式。

@media screen and (max-width: 767px) {

    .row-offcanvas-right .sidebar-offcanvas {
      right: -100%;
    }

    .sidebar-offcanvas {
      position: absolute;
      top: 0;
      width: 100%;
    }

    .row-offcanvas-right.active {
      right: 100%;
      margin-left: 0;
      margin-right: 0;
    }

}

关于javascript - 使Bootstrap列从屏幕右侧进入,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/28595687/

10-11 13:16