javascript - 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)展开元素时，'height' 显然是正确的值。

我也试过$(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});
 });