计算高度并使用jQuery应用于div

Question

我有一个横幅图像，只有在设置固定高度时才可见，我想使其具有响应性，所以我想到的唯一方法是计算带有窗口宽度的图像高度。

计算高度的函数是：windowWidth / 1.845

我如何使用jQuery / javascript将该功能应用于div CSS？

我尝试了此功能，但是没有用

    $(document).ready(function(){
  var originalWidth = $( window ).width();
  var newHeight = originalWidth/+(1.845)
; 


  function resize() {
    $("#ei-slider").css("height", newHeight); 

  }

  $(".target").each(resize);
  $(document).resize(function(){
      $("ei-slider").each(resize);
  });
});

Answer 1

调用函数调整大小时尝试添加（）

$(".target").each(resize());
  $(document).resize(function(){
      $(".ei-slider").each(resize());
  });

另外，您错过了ei-slider之前的观点

我强烈建议您使用backstretch jquery插件。 http://srobbin.com/jquery-plugins/backstretch/

Answer 2

为什么在设置固定高度时仅显示图像？ 如果要在CSS中执行此操作，则图像将自动“响应”。

img {
  max-width: 100%;
  width: 100%;
}

但是，如果您需要在调整大小时执行其他操作，则可能要在window而不是document上侦听调整大小。

$(document).ready(function () {

  var $window = $(window);
  var originalWidth = $window.width();
  var newHeight = originalWidth / 1.845; 

  function resize() {
    // This will be .target or .ei-slider based on where it's called.
    $(this).css("height", newHeight);
  };

  $(".target").each(resize);

  $window.on('resize', function(){
      $(".ei-slider").each(resize);
  });

});