0

どうやらこれは私だけに起こっているようです - 理由はわかりませんが、うまくいくなら、私は幸せです:)

フルスクリーンのスライドショーがあり、大きすぎる画像を垂直方向に中央揃えにする機能を作成しました。

    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;も試しました。すべて同じものを返します。

ありがとう

4

1 に答える 1

0

私はいくつかのテストを行い、 $('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});
 });
于 2013-03-07T16:32:37.853 に答える