position fixed在iPhoneXs max下被遮挡问题

由于业务需要，自己做了一个从底部弹起的组件，类似modal，组件只有两个部分，一个遮罩层，一个内容区域，样式代码如下：

.mask{   position: fixed;   top: 0;   bottom: 0;   left: 0;   right: 0;   background: #222;   opacity: 0.5;   overflow: visible; } .modal{   position: fixed;   bottom: 0;   background: #fff;   width: 100%;   opacity: 1;   overflow: visible;   z-index: 4; } @-webkit-keyframes show{   from{height: 0;} }

在安卓以及其他iPhone下，显示正常，正常图如下：

但是在iPhonexs Max下，这个modal第一次从隐藏变显示时的表现是这样的：

关闭之后再次点击又恢复正常，请问这个问题有什么好的解决方法啊