imagesloaded插件有时无法正确加载图像

debugcn 发表于 Dev

你的

我正在构建一个应用程序，该应用程序可以加载多个图像并对其进行动画处理。为此，我需要加载图像，抓取宽度并将左边距设置为图像的宽度。这在大多数情况下都有效，但是有时imagesloaded插件认为图像已加载，但是当我访问宽度时，它以NaN形式出现。

    $(fragment).imagesLoaded()
    .done( function() {
        console.log('done');
    })
    .always( function( instance ) {
        console.log('all images loaded');
    })
    .fail( function() {
        console.log('all images loaded, at least one is broken');
    })
    .progress( function( instance, image ) {
        var result = image.isLoaded ? 'loaded' : 'broken';
        console.log( 'image is ' + result + ' for ' + image.img.src );

        $.each(elems, function( k, v ) {
            var imagewidth = image.img.width * $('.row').height() / image.img.height;
            console.debug('---------------------');
            console.debug('v: ', v);
            console.debug('v.width: ', imagewidth);
            console.debug('isNaN: ', isNaN(imagewidth));
            if (isNaN(imagewidth)) {
                $(v).css({'margin-left': '-' + imagewidth + 'px', 'margin-right': '100px'});
                $(v).stop().animate({'margin-left': 0, 'margin-right': 0}, 400, 'easeOutCubic');

            }

        });
    });

任何建议/想法表示赞赏。我在Mac上使用的是Google Chrome浏览器！

你的

看起来这是图像加载插件中的一个错误，该错误与宽度不适用于chrome中的缓存图像有关。有人推送了以下修复程序，为我解决了该问题：

https://github.com/nyroDev/imagesloaded/commit/51288c54bca5b36137d3065a6b45dee6f02a2a90

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。