我的应用程序中有一个模态对话框,它在y方向上会很长.这会带来一个问题,即对话框的一些内容隐藏在页面底部.
我希望窗口滚动条滚动对话框时,它是显示和太长,不适合在屏幕上,但留下的主体在后面的模式.如果你用Trello,那么你知道我想要什么.
这在不使用JavaScript控制滚动条的情况下是可能的吗?
以下是迄今为止我应用于模态和对话框的CSS:
body.blocked {
overflow: hidden;
}
.modal-screen {
background: #717174;
position: fixed;
overflow: hidden;
width: 100%;
height: 100%;
top: 0;
left: 0;
opacity: 0.9;
z-index: 50;
}
.dialog {
background: #fff;
position: fixed;
padding: 12px;
top: 20%;
left: 50%;
z-index: 10000;
border-radius: 5px;
box-shadow: 0, 0, 8px, #111;
}