css - HTML&CSS3*JavaScript 高级滚动

Question

我需要使用 HTML、CSS3 和 JavaScript 创建一个工具。它将包含一些水平和垂直滚动条，以便正确查看所有内容，并保持某些元素的固定大小。这是试图解释我想要的布局

因此，我有一个包含#left 和#right DIV 的#main DIV。左 DIV 包含两个 DIV，右 DIV 包含另外 2 个 DIV。现在，我想创建一个垂直滚动条 (vscroll1) 来上下滚动 #content 和 #menu DIV(同时，就像它们在哪里相同的 DIV)。另一方面，我希望水平滚动条 (hscroll2) 同时通过 #content 和 #left_top_div 向左和向右滚动，就像它会那样内容相同。

我想我可能有两种方法:一些 CSS+HTML 技巧或使用 JavaScript。现在，如果将滚动条附加到 #leftdiv (overflow:auto)，它将滚动 #left_top_div 和 #content(它包含的 DIV)，如我所愿，但它只会垂直滚动 #content，而不是 #menu DIV。所以，这是个问题。我可以将 JavaScript 与 .onscroll() 事件一起使用来更改#menu topMargin，但是有一个看起来不太好的小延迟。你建议我做什么？我只需要一些技巧或技巧(好吧，一些示例代码也很受欢迎)。至少感谢大家阅读我的所有问题。

Answer 1

默认情况下将所有 div 的 CSS 溢出设置为“隐藏”。然后……

使用 overflow-y: scroll;

将#menu 和#content 包裹在固定高度的 div 中

然后使用 overflow-x: scroll

创建#menu 和#content 固定宽度的 div