jquery - 在固定元素上滚动时在主体上滚动，反之亦然

Question

所以我有这个 div:

.sidebar{
  position: fixed;
  background: #222;
  height: 100%;
  width: 280px;
  overflow-y: auto;
}

然后我有页面内容:

.content{
  width: calc(100% - 280px);
  background: #fff;
  margin-left: 280px;
}

.content 中的内容因页面而异，因此有时页面较大，有时则不然。但是有一个问题，如果侧边栏不适合视口(viewport)，它会出现一个滚动条。我想实现三件事:

• 移除滚动条(即使其不可见)。
• 当你滚动 .content 时，你也会滚动.sidebar.
• 当你滚动 .sidebar 时，你也会滚动.content.

如何实现？即使使用 jQuery，有没有办法做到这一点？提前致谢!

Answer 1

将两者都放在一个容器 DIV 中，同时给它们 overflow-y: visible 并给容器overflow-y: auto。然后当容器中的两个元素中的任何一个高于容器时，容器就会滚动。

啊 - 并从边栏中删除 position: fixed...