element.height 返回可见高度 - 我想要总高度？

Question

所以显然这只是发生在我身上 - 我想不出为什么，但如果它有效，我很高兴 :)

我有一个全屏幻灯片，我创建了一个函数，可以垂直居中任何太大的图像。

    function fixImages(){
    maxheight = $('.index-slide-container').height();
    $('.index-slide-container img').each( function(index, ele){
        if (ele.height > maxheight){
            offset = ( maxheight - ele.height ) / 2;
            $(ele).css('top', offset + 'px');
        }
    });
}
fixImages();

然而，ele.height 返回图像可见部分的高度（它的容器的高度，因为它有overflow:hidden，即使当我console.log(ele) 并展开元素时，“高度”显然是正确的值。

我也试过$(ele).height()、$(ele).css('height')、$(ele).outerHeight()和ele.clientHeight；所有这些都返回相同的。

谢谢

Answer 1

我做了一些测试，$('img').height();正在给我正确的图片高度。

如果您希望图片垂直居中，为什么不使用 css 的绝对定位，例如：

.index-slide-container img {
    position:absolute;
    top:50%;
}

然后，您可以使用 jQuery 以编程方式设置负边距：

 $('.index-slide-container img').each( function(i, e){
     var height = $(e).height() / 2;
     $(e).css({'margin-top':'-'+height});
 });