当模态有时大于屏幕时，我如何水平/垂直居中模式弹出窗口

How can I horizontally/vertically center a modal popup when the modal is sometimes bigger than the screen?

本文关键字：水平 垂直居中 窗口 模式 何水平 大于 模态 屏幕      更新时间：2023-09-26

我知道如何使用javascript将模态居中，但是当模态高于视口时，我遇到了问题。模态的顶部将隐藏在屏幕顶部。

你想拿 

    (windowHeight - modalHeight) / 2

作为模态的顶部位置 

    if (modalHeight < windowHeight) 
    else make top as 0 or may be 10.

我想你已经解释过了。

一个可能的问题是，如果您使用的是固定定位的模态，溢出的部分将不会显示，在这种情况下，您应该提供小提琴或链接来帮助您处理您的情况。

对于固定位置的溢出，您可以将模态最大高度设置为 100%，并在模态中显示滚动条。如果模态是叠加的子项，则可以将叠加的最大高度设置为 100%，并改用叠加上的滚动条。

如果您使用的是绝对定位模态，您将获得 body 的滚动条。

伪代码

top = (modalHeight < windowHeight)? (windowHeight - modalHeight) / 2 : 10 ;
相关文章：