我的应用程序中有一个模态对话框，可以在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,8px,#111;
}
解决方法
只是使用
.modal-body {
max-height: calc(100vh - 210px);
overflow-y: auto;
}
它将安排你的模态，然后给它一个垂直的滚动
