Question

我无法将此模态对话框用于工作属性。

问题是在浏览器中会设置在页面顶部。因此，如果用户滚动到页面底部，它将不会显示黑色背景，只显示模态窗口。

此外，如果窗口小于特定高度（例如200px），则无法看到对话框。

我希望在用户所在的位置将对话框设置为固定，并在屏幕中间显示对话框，无论页面中的滚动位置如何。

请参阅JS BIN示例。

Answer 1

.modal-mask应该有

  position: fixed;

你应该得到.modal-window的outerWidth和outerHeight来包含填充。此外，应该在点击时计算左侧和顶部位置，以便即使窗口更改尺寸它们也是准确的。 http://jsfiddle.net/VirusZ/XqAFy/

Answer 2

要获得完整的背景遮光，请将.modal-mask的高度设置为$（window）.height（）而不是100％。