Javascript 页面中间的jQuery中心

我正在开发一个div容器，一次单击即可打开
此div容器不显示，位于click元素下。
现在我试图将它垂直居中，但没有成功。
在Stackoverflow上发现了一些其他问题，但没有人为我工作

$（窗口）。调整大小（函数（）{ $（“.modal box”）.css({ 顶部：（$（窗口）.height（）-$（“.modal box”）.outerHeight（）/2）+$（窗口）.scrollTop（）+“px”） }); }); 问题是：开始时，div几乎超出底部屏幕，下面的div超出顶部屏幕。

---

我会把每个div放在屏幕中间，不管位置如何。

as @ raskh评论这个问题，这只能用CSS来完成；看到这把小提琴了吗

你必须使用2个分区。 外部100%全宽/全高，绝对定位，显示设置为表格，居中对齐-如下所示：

显示：表格；
最小宽度：100%；
最小高度：100%；
位置：绝对位置

内部div（即居中的容器）必须将css显示设置为表格单元格，并为此容器提供居中对齐：

显示：表格单元格；
垂直对齐：中间对齐；
文本对齐：居中

把你想要的东西放进去；fiddle示例在这个中间容器中包含额外的html以作为示例显示。
CSS显示属性的表和表单元格值在这里扮演着神奇的角色。这是一篇非常好的文章，可以理解
plz创建一个jsfiddle，这可以单独使用CSS来完成。你想要那个解决方案吗？我已经尝试了css，但没有成功=）。如果你有一个解决方案，我会很高兴的=）。创建一个JSFIDLE或发布你的html和一些你需要支持的浏览器，或者什么版本的Internet Explorer？但是如果父容器在站点容器中（不能更改我的模板），它也可以工作吗？今天不能考试。。上传视频需要几个小时…你试过了吗？首先尝试可能总比主动要求好。顺便说一句，它应该仍然有效-但可能需要对父/外部容器css进行更多的调整。如果没有，创建一个fiddle并将我们链接到-与您的确切工作/非工作代码
$(window).resize(function() {
  $(".modal-box").css({
    top: (($(window).height()  - $(".modal-box").outerHeight() / 2) + $(window).scrollTop() + "px")
  });
});