Jquery 在DIV内垂直对齐图像

我有一个相当小的问题，我认为可以通过重新思考我的CSS来解决

在页面的一部分，我有一系列的图片。最初，每个图像都是隐藏的（请参见下面的CSS）。我让它工作得很好。当页面加载时，第一个图像通过jquery淡入。有一个计时器设置，X秒后，当前图像淡出，下一个淡入

每个图像包含在一个较大的div中。图像应该是坐在div的中间（垂直和水平）。由于每个图像可能有不同的大小，我不得不写一些逻辑来检查图像的高度，并动态调整其边距（同样，请参见下面的代码）。这很好，除了第一张图片。第一个图像的计算高度始终为0。。。这使得它看起来比div的中间低

使用垂直对齐可以达到同样的效果吗？到目前为止，我一直不成功

非常感谢您的帮助

谢谢 代码

加价

    <div id="logowrapper">
        <div class="logo">
            <img src="" />
        </div>
        <div class="logo">
            <img src="" />
        </div>
        <div class="logo">
            <img src="" />
        </div>
    </div>

JS

---

我认为垂直对齐只适用于内联元素。例如，见。尝试更改

显示：块到
显示：内联

编辑：或者，如果不起作用，直接在图像标签上设置
垂直对齐
显示项目，检查其高度并再次隐藏。jQuery在测量隐藏元素方面做得不好。它会发生得很快，用户看不到它。
当您尝试获取其高度时，第一个图像可能没有加载完毕。其他的工作，因为当你到达这些，他们已经完全加载

您可以使用
load
事件而不是
ready
来等待图像加载。使用jQuery：

$(window).load(function() {
    ...
});

我想你可以使用
“#logowrapper”
而不是
窗口
来只等待包装内的图像加载，但我从来没有这样做过。
这是否可能发生在基于web工具包的浏览器（chrome、safari）中

如果是，您可以使用
$（window）.load（function（）
而不是
$（document）.ready（function（）
），因为问题可能是高度未知，因为图像尚未加载。
带有in div的垂直线图像正在chrome和safari上工作

这些物业包括：

<div class="image-wrap">
<img src="xyz.png"/>
</div>


.image-wrap {
display:table-cell;
width:400px;
vertical-align:middle;
}


.图像包裹{
显示：表格单元格；
宽度：400px；
垂直对齐：中间对齐；
}
嘿，罗伯特，你有没有一个公开的例子可以展示一下？目前还没有……我们定于下周某个时候发布。就这样。效果很好。谢谢
$(window).load(function() {
    ...
});

<div class="image-wrap">
<img src="xyz.png"/>
</div>


.image-wrap {
display:table-cell;
width:400px;
vertical-align:middle;
}