html H5 dialog弹窗学习,实现弹窗内容 替代confirm
框架使用的mui,使用mui.confirm() 弹窗内容过多时,弹窗被撑的到屏幕外去了,使用H5 dialog 标签自定义一个固定大小的弹窗,内容过多时可下拉显示
效果展示
隐私政策内容很多,可以下拉显示
代码
myDialog.css
dialog{
padding:0;
border:none;
box-shadow:0px 1px 3px rgba(0,0,0,0.2);
width:80%;
border-radius:10px;
height: 430px;
}
.diaHeader{
padding:10px;
color:#fff;
border-radius:10px 10px 0 0;
background:#50a8fa;
}
.diaContent{
padding:30px 12px 30px 12px;
overflow: auto;
height: calc(100% - 91px);
}
.diaFooter{
display: flex;
align-items