在文檔加載時獲取圖像高度

我想設置div＃頂部高度等於圖像高度。我寫道：在文檔加載時獲取圖像高度

$(document).ready(function() { 
    setTopHeight(); 
}); 

/* 
* window resizing 
*/ 
$(window).resize(function() { 
    setTopHeight(); 
}); 

/* 
* setting #top height by banner height 
*/ 
var setTopHeight = function() { 
    var bannerHeight = $('#banner-image').height(); 
    $('#top').height(bannerHeight + 'px'); 
};

它適用於調整大小，但不重新加載。我試過這樣：

$(document).ready(function() { 
    setTimeout(function() { 
     setTopHeight(); 
    }, 50); 
});

它的工作原理，但它當然不是解決方案。有人可以告訴我爲什麼console.log返回0嗎？

$(document).ready(function() { 
    console.log($('#banner-image').height()); 
});

來源

2013-03-20 Dhofca

是banner-image img標籤的id或它的圖像包裝div ID？ – 2013-03-20 10:57:36

.ready將無法工作，因爲您的圖像尚未加載。使用.load

來源

2013-03-20 10:57:07 btevfik

$(document).ready當DOM準備就緒時會觸發，但圖像可能仍在下載 - 所以沒有高度。您可以在圖片上使用jQuery load。

$('#banner-image').on('load', function() { 
    setTopHeight(); 
})

來源

2013-03-20 10:57:09

jQuery .load()充當事件處理程序。是.on('load, function(){})的快捷方式。一旦圖像/元素完全加載，它將被觸發。

實施例1：

$('#banner-image').load(setTopHeight);

實施例2

$('#banner-image').load(function(){ 
    setTopHeight(); 
});

實施例3

$('#banner-image').on('load', setTopHeight);

來源

2013-03-20 10:58:40 iDev247

謝謝你和埃米爾伊萬諾夫 – Dhofca 2013-03-20 11:02:11

嘗試.load（）來代替。就緒（）

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

來源

2013-03-20 10:59:13 grigno

圖像加載在文檔之後的第二個HTTP循環中。所以你需要聽圖像加載

$('#banner-image').load(setTopHeight);

來源

2013-03-20 11:01:37 Shuping

在文檔加載時獲取圖像高度

回答

相關問題