网站有多栏布局时，侧边栏高度不够会显示大片空白；Theia Sticky Sidebar 就可以让网站的所有侧边栏，在网页上下滚动时，永久可见，类似于固定侧边栏。

演示地址：

3 栏演示 4 栏演示 Bootstrap 4 演示 Foundation 演示

首先，你需要下载

下载地址

theia-sticky-sidebar

然后，引入 js 文件

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript" src="theia-sticky-sidebar.js"></script>
<script type="text/javascript">
  jQuery(document).ready(function() {
    jQuery('.sidebar').theiaStickySidebar({
      // Settings
      additionalMarginTop: 30
    });
  });
</script>

让你的 HTML 结构成这样

<div class="wrapper">
  <div class="content">
    ...
  </div>
  <div class="sidebar">
    ...
  </div>
</div>

最后，至此已经实现了部署。如果你也喜欢这样的侧边栏浮动效果的话，那就不要犹豫赶紧折腾吧，祝成功！

可用配置参数及说明：

containerSelector：侧边栏的父容器元素。如果没有指定直接使用侧边栏的父元素。
additionalMarginTop：可选值。指定侧边栏的顶部 margin 值，单位像素，默认为 0 像素。
additionalMarginBottom：可选值。指定侧边栏的底部 margin 值，单位像素，默认为 0 像素。
updateSidebarHeight：是否更新侧边栏的高度。默认为 true。
minWidth：如果侧边栏的宽度小于这个值，将恢复为正常尺寸。默认值为 0。（该选项用于响应式设计）
defaultPosition：侧边栏必须是非 static 的定位方式。默认为 relative 定位方式。
namespace：绑定事件的命名空间。默认为 TSS。