javascript - HTML 模态对话框溢出

Question

我正在开发一个网站，单击按钮时会显示一个模式对话框。我希望背景不能滚动，但是对话框可以滚动，这是我在 JSFiddle 上的代码.我认为该对话框应该嵌入另一个 div 中，该 div 的 overflow 设置为 auto 但这不起作用。任何解决方案。？

更新

从这张图片中，我希望红色区域可以滚动，同时保持绿色区域不可滚动。

Answer 1

我相信我能够获得您想要实现的功能。似乎让您感到困难的是您试图让一个滚动条跨越页面上的多个元素，而标记中没有要应用该 CSS 规则的元素。只需将您希望滚动的所有元素包装在一个容器中，并将该容器设置为 overflow: auto(并从其他元素中删除溢出规则)。

编辑

根据下面的评论，我更新了 fiddle 。和以前一样的想法，但现在可滚动的包装器是主体本身。这里唯一的问题是您在对话框上的 CSS 是 position:fixed，但按理说您将无法滚动相对于视口(viewport)定位的内容。

Fiddle