添加粘性侧边栏

Question

我正在尝试将粘性侧边栏与来自 Github 个项目的 theiaStickySidebar 一起使用。如上link所述，这应该是一件容易的事。我使用以下 HTML 构造：

<aside class="sidebar">
 <div class="theiaStickySidebar">
 ...
 </div>
</aside>

所有这些脚本都需要工作。

并且还使用 Github 页面中提到的 scripts，如下所示：

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript" src="dist/ResizeSensor.min.js"></script>
<script type="text/javascript" src="dist/theia-sticky-sidebar.min.js"></script>

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

但这暂时不起作用。

我是不是在这个过程中做错了什么？

Answer 1

Jquery 选择器似乎有误。使用 .ssidebar 或 theiaStickySidebar 取决于你想要哪一个作为侧边栏。

例如

<script type="text/javascript">
  jQuery(document).ready(function() {
     jQuery('.content, .ssidebar').theiaStickySidebar({
      // Settings
      additionalMarginTop: 30
    });
  });
</script>

Answer 2

我只是没有删除多余的 class .content。对于：

<aside class="sidebar">
 <div class="theiaStickySidebar">
 ...
 </div>
</aside>

必须使用：

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript" src="dist/ResizeSensor.min.js"></script>
<script type="text/javascript" src="dist/theia-sticky-sidebar.min.js"></script>

<script type="text/javascript">
  jQuery(document).ready(function() {
    jQuery('.sidebar').theiaStickySidebar({
      // Settings
      additionalMarginTop: 30
    });
  });
</script>

添加粘性侧边栏

Add sticky sidebar

javascript

sticky