Theia sticky sidebar master 两栏（三栏）侧边栏跟随固

Theia sticky sidebar master是使用率很高的侧边栏jQuery插件，可以智能跟随固定范围的浮动效果。

Theia sticky sidebar master演示地址

示例一

示例二

示例三

示例四

Theia sticky sidebar master使用

Html文档结构

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

引入js

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

参数说明：

containerSelector：侧边栏的父容器元素。如果没有指定直接使用侧边栏的父元素。

additionalMarginTop：可选值。指定侧边栏的顶部margin值，单位像素，默认为0像素。

additionalMarginBottom：可选值。指定侧边栏的底部margin值，单位像素，默认为0像素。

updateSidebarHeight：是否更新侧边栏的高度。默认为true。

minWidth：如果侧边栏的宽度小于这个值，将恢复为正常尺寸。默认值为0。(该选项用于响应式设计)

defaultPosition：侧边栏必须是非static的定位方式。默认为relative定位方式。

namespace：绑定事件的命名空间。默认为TSS。

下载地址

可以去Githu上直接下载资源，如果不能访问的可以下由博主提供的网盘下载，两个资源都是一样的

Github：https://github.com/WeCodePixels/theia-sticky-sidebar