jquery - 在不知道父级高度的情况下垂直居中子 div

Question

我想知道有人知道如何在不知道父 div 高度的情况下将子 div 在父 div 中垂直居中？

我有一个 pinterest 风格的图库页面(图片)，悬停时我在图片顶部显示一个包含图片信息的 div。知道因为每个图像可能有不同的高度，我不知道如何将子内容居中到父 div 的中间。

我正在使用 jQuery Masonary 插件来创建布局。

目前我有一个包含图像的外部 div。一个内部 div，背景颜色为白色(或其他颜色)，位置为 0,0，宽度和高度为 100%。这一切都很好，我已经能够通过简单地使用 text-align: center; 水平居中;

非常感谢!

Answer 1

这应该可以将其设置为双向居中。还没有测试:

var ParentW = $("parent-id").width();
var ParentH = $("parent-id").height();
var ChildW = $("child-id").width();
var ChildH = $("child-id").height();
var PosW = (ParentW - ChildW)/2;
var PosH = (ParentH - ChildH)/3;
$("child-id").css({"top":PosH, "left": PosW });