文章/答案/技术大牛

发布

社区首页 >问答首页 >在bootstrap中可以做一个部分折叠的侧边栏吗？

问在bootstrap中可以做一个部分折叠的侧边栏吗？
EN

Stack Overflow用户

提问于 2014-04-25 02:41:53

回答 1查看 1.6K关注 0票数 0

我正在尝试建立一个Bootstrap页面，将有一个侧栏，其中部分折叠滚动…它应该折叠到一个更窄的版本(例如图标而不是文本样式)，这种折叠将发生在滚动上，然后可以通过单击一个元素来打开它的全宽度。

我的问题是，当考虑到引导时，我不知道如何让它工作，因为对于宽屏来说，侧边栏需要固定在最左边(或最右边)……我不在boostrap部分...例如，对于平板电脑视图，我假设侧边栏需要占据一个或多个列(否则我将需要调整整个页面的正文填充)，我可以这样做，但我希望有一些经过试验和测试的方法。我确信我看到过这种技术的使用，但我找不到一个这样的例子。有没有人知道如何解决这个问题，或者这是否可能。

javascript

jquery

html

css

twitter-bootstrap

回答 1

Stack Overflow用户

发布于 2014-04-27 13:14:47

HTML：

<div id="wrapper">
  <div id="sidebar">
    .....
  </div>
</div>

JS：

$( window ).scroll(function() {
    $("#wrapper").toggleClass("active");
});

CSS：

#sidebar{
  position: fixed;
  left: 0;
  width: 200px;
}
#wrapper.active #sidebar{
  width: 100px;  
}

这将在窗口滚动上切换侧边栏的宽度。您还可以将窗口滚动功能添加到侧栏鼠标单击事件侦听器中。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/23277188

复制

相似问题

问在bootstrap中可以做一个部分折叠的侧边栏吗？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在bootstrap中可以做一个部分折叠的侧边栏吗？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在bootstrap中可以做一个部分折叠的侧边栏吗？
EN