无法检测图像高度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);
});