jQuery：各関数を使用してdivの途中でイメージを整列する方法

Question

各関数を使用してdiv内のすべてのイメージを中央に配置するためにスクリプトを作成しました。これは、コードです：私は上のすべてのdivの高さ

$('.myImg').css({'top': toBeCentered + 'px','left': 0}); 

コードの一部に常に最後の1 .COL divの高さを取得をtoBeCentered VARで

 $('.column').each(function(){ 

      var colHeight = $(this).innerHeight(); 
      var colWidth = $(this).width(); 



      var getCenter = (colHeight - imgHeight);    
      var toBeCentered = (getCenter/2); 

      var toReduceWidth = (colWidth - imgWidth); 
      var getReducedWidth = (toReduceWidth/2);  



     $('.myImg').css({'top': toBeCentered + 'px','left': 0}); 


     }); 

はと呼ばれ、最初からすべてが始まるわけではありません。 関連するdivの高さをイメージに設定するにはどうすればよいですか？

Answer 1

あなたのような何かをする必要があります：あなたはeach機能の反復ごとに、すべての.myImgオブジェクトのためのCSS属性を設定しているので

$('.column').each(function(){ 
    // ... 
    $(this).find('.myImg').css({'top': toBeCentered + 'px','left': 0}); 

}); 

を。 .myImgオブジェクトが.columnクラスにある場合、上記の解決策が動作します。

Answer 2

これはスクリプト以外のCSSです。

.column{ 
    display:flex; 
    align-items:center; 
} 
.myImg{ 
    display: block; 
    margin: 0 auto; 
}