Question

我有一个网站http://atlantaartmap.com，主页由http://atlantaartmap.com/art.js填充。底部有一个导航栏，可以在填充地图的其余部分时附加geojson文件中的多个图像。

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

出于某种原因，我无法将这些图像转为延迟加载。而不是把它应用到班级＆＃34;懒惰，＆＃34;我将它应用于＆＃34; navthumb＆＃34;我已经上过的课程。我已经尝试了一些其他的懒加载插件（揭开其他主要插件），我也尝试从基础设备中剥离一切并重新构建它。这是因为我将lazy_art.js添加到导航条的方式吗？

提前感谢您的帮助。

Answer 1

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

$(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

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

1 个答案: