延迟加载不适用于由传单/地图框添加的图像

Question

我有一个网站http://atlantaartmap.com ，主页由http://atlantaartmap.com/art.js填充。 底部有一个导航栏，可在填充地图的其余部分时添加来自geoj​​son文件的许多图像。

我正在尝试使用http://www.appelsiini.net/projects/lazyload将延迟加载应用于这些图像。 我正在测试的网站版本为http://atlantaartmap.com/lazy.html ，它使用http://atlantaartmap.com/lazy_art.js生成所有内容。

由于某些原因，我无法使这些图像延迟加载。 我没有将其应用于“惰性”类，而是将其应用于现有的“ navthumb”类。 我已经尝试了其他一些延迟加载插件（主要是另一个），并且还尝试了从基础知识中剥离所有内容并进行备份。 是因为我让lazy_art.js将图像添加到导航条的方式引起的问题吗？

在此先感谢您的帮助。

Answer 1

在调用脚本之前，您已将调用lazyload放在html页面中

$(function() {
    $("img.navthumb").lazyload();
});

调用此命令时，尚未创建缩略图。

因此，您必须将此调用移至lazy_art.js

var oneArtPlease = L.mapbox.featureLayer()
    .loadURL('art.geojson')
    .addTo(map);

oneArtPlease.on('ready', function() { 
   $("img.navthumb").lazyload();
}); 

参考： https : //github.com/mapbox/mapbox.js/blob/v2.1.4/src/feature_layer.js#L54