無法檢測圖像高度jquery

Question

jQuery(document).ready(function($) { 
    $(function() { 
     $(".zoom").hover(function() { 
      $(this).stop().animate({ 
       opacity: 0.7 
      }, "fast"); 
     }, 
     function() { 
      $(this).stop().animate({ 
      opacity: 0}, 
      "fast"); 
     }); 
     }); 

    function resizeElements() { 
     // find out the width of the page 
     var img_width = $(".img-effect, .wp-post-image").width(); 
     var img_height = $(".img-effect").height(); 

     // apply the new width to the middle column 
     $('.zoom, .caption').css('width', img_width); 
     $('.zoom').css('height', img_height); 
    } 

    $(window).resize(resizeElements); 

}); 

var img_width = $(".img-effect").width(); 
var img_height = $(".img-effect").height(); 
$('.zoom').css('width', img_width); 
$('.zoom').css('height', img_height); 

您能否幫我解決上述問題。當我提醒img_width它顯示我的圖片寬度，但當涉及到img_height它的結果爲0.圖像正常顯示。有趣的是，在調整大小時，它會檢測高度。

Answer 1

很有可能圖像尚未加載到文檔上。改爲使用窗口加載事件。當所有圖像完全加載並可見時，將觸發窗口加載事件。見http://api.jquery.com/load-event/。

試試這個：

$(window).load(function() { 
    var img_width = $(".img-effect").width(); 
    var img_height = $(".img-effect").height(); 

    alert(img_height); 
});