3

我正在使用 AJAX 在特定容器中加载 html 和图像。我需要为封闭容器的高度设置动画，所以我尝试了：

// load content
var id = $(this).data('id');
$.get('content/'+id+'/html/content.html', function(data) {

    // insert html
    $('#overlay-inner').html(data);

    // show overlay
    $('#overlay').fadeIn();

    // add new height to wrapper
    var height = $('#overlay').height() + 200;
    console.log(height);
    $('#wrapper').animate({'height':height});

});

不幸的是，它仅在某些时候有效，因为高度不正确。加载的数据包含一些图像，它们需要一点时间来加载。

有什么方法可以检查是否所有图像都已加载，所以我可以在完成加载后为高度设置动画？

4

1 回答 1

1

使用 ImagesLoaded 插件：

https://github.com/desandro/imagesloaded

有关示例，请参见该页面。

jQuery$().load不起作用，因为当图像已经缓存时它不会触发（请参阅jquery: image width on domready or load?）

于 2012-11-19T12:22:45.570 回答