在jQuery中獲取背景圖片的長寬比

Question

客戶有一個使用主題遠足者的基於WordPress的網站。 在此頁面上，有一個畫廊，而不是嵌入式圖像，使用背景圖像。

我需要確定那些高度比過高的圖像的值。 如果該比率小於1，請在每個符合該條件的幻燈片（列表元素）中添加background-size: contain 。

我做了這個功能：

function setBackgroundSize() {
    var $sliderItem = $(".full-photos li");
    $sliderItem.each(function(){
      var imageSrc = $(this).data('image-src');
      imageSrc.replace(/url\((['"])?(.*?)\1\)/gi, '$2')
      .split(',')[0];
      var image = new Image();
      image.src = imageSrc;
      var width = image.width,
      height = image.height,
      ratio = width/height;
      console.log(ratio);
      if (ratio < 1) {
        $(this).css('background-size', 'contain');
      }
    });
}
$(window).load(setBackgroundSize());

問題是它僅在頁面加載后才起作用，我刷新了它 。 腳本出了什么問題？ 謝謝！

Answer 1

$(window).load(setBackgroundSize()); 正在立即執行setBackgroundSize函數（在加載事件發生之前）。 傳遞對函數的引用：

$(window).load(setBackgroundSize);

要么

$(window).load(function() { setBackgroundSize(); });

Answer 2

也許您可以這樣運行它：

$(window).resize(function() { setBackgroundSize(); });

我希望我能正確理解你。