根据内容高度调整图像高度

Question

我编写了下面的jQuery，以实现我的图像的完全响应高度，相应地调整其旁边的内容高度。请查看我的代码CodePen。我的问题是，每当我调整屏幕宽度时，图像都不会动态调整高度。如何实现这一全动态解决方案？请尽可能帮助我。

function setImageHeight() {
  $('.single-tile').each(function(){
    var tile_height = $(this).height(); 
    $(this).find('.image').height(tile_height);  
    }
  ); 
}
$(document).ready( function () {
  setImageHeight();
});
$(window).resize( function () {
  setImageHeight();
});

Answer 1

对于响应高度设置css属性为高度：100％和响应宽度设置边距：auto。所以下面的css类将为你做到这一点。

   .responsive-image {
height:100%;
margin:auto;
}