Bootstrap折叠侧边栏不隐藏到一边

我的自举代码有问题。我试图在移动设备上从右侧进入侧栏，几乎完全像这里：http://getbootstrap.com/examples/offcanvas/但我似乎无法使其工作。我也试图让左边和右边的箭头之间的雪佛龙图标发生变化，但即使我已经使用左侧边栏工作，它也不起作用。我的项目位于这里，任何帮助赞赏piston.serverpit.com/bootstrap/main Bootstrap折叠侧边栏不隐藏到一边

编辑：我已经设法让按钮和行动工作正确，现在唯一的问题似乎是侧边栏本身放置在页面的内容下，而不是到它的一面。我该如何解决？

Fiddle: http://jsfiddle.net/zauLh39y/

EDIT2：由从零开始与offcanvas例如有一个工作的例子，但是当我试图把文章的代码进入体内，然后它仍然打破...想法？似乎主要的问题是在CSS中设置侧边栏的最小宽度。 http://jsfiddle.net/xyd6ttbe/

来源

2014-12-02 xSpartanCx

SO需要的代码* *在这里。 – isherwood 2014-12-02 20:10:19

将您的代码放在小提琴中 – BernieSF 2014-12-02 20:13:16

已更新为代码。 – xSpartanCx 2014-12-02 22:17:24

我设法解决它;主要的问题是强制侧边栏的宽度以及它最终被推到文章下面的原因是因为<hr>标签。

对于更新的代码在这里看到：http://jsfiddle.net/rwstwv0e/

来源

2014-12-04 14:13:06 xSpartanCx

根据您的外部例如，更新到这个

#sidebar{ 
    position: absolute; 
    /* no float, no left or right */ 
} 
.row-offcanvas-right { 
    left: 100%; /*instead of right xx...*/ 
} 
.row-offcanvas-right.active { 
    left: 50%; /*instead of right xx...*/ 
}

您可能需要更新宽屏幕模式的CSS，太。顺便说一句：如果你在jsfiddle，codepen或者stackoverflow中提供了一个工作演示，它会更容易帮助你。

来源

2014-12-02 20:54:15 dsuess

这似乎不工作得很好。我遇到的问题是，当我缩小窗口时，侧栏会移动到内容下方，然后一旦它被视为移动设备，它将停留在底部。在我提出的问题中，当缩小窗口时，侧边栏完全消失，当您点击切换侧边栏按钮时，窗口大小不会改变（您不能向左或向右滚动），这正是我想要的。 – xSpartanCx 2014-12-02 22:04:47

Bootstrap折叠侧边栏不隐藏到一边

回答

相关问题