Blueimp Gallery - 缩略图指示器问题

时间:2015-07-14 11:39:52

标签: jquery blueimp jquery-lazyload

我使用blueimp gallery的jQuery版本。我在幻灯片页面上使用Lazy Load来在用户滚动时加载缩略图。由于在初始页面加载时未加载所有缩略图,并且折叠下方的缩略图不会显示在blueimp图库的缩略图指示器上,因此我在链接标签上设置了data-thumbnail属性,如下所示:

<a href="photos/1-full.jpg" data-thumbnail="photos/1-thumb.jpg">
  <img data-original="photos/1-thumb.jpg" alt="Image 1" />
</a>

但是,它似乎仍然尝试从图像标记的src属性加载缩略图,这是Lazy Load设置的占位符图像。

我做得对吗?

1 个答案:

答案 0 :(得分:0)

这实际上涉及更改blueimp Gallery脚本本身。变化如下:

--- a/js/blueimp-gallery-indicator.js
+++ b/js/blueimp-gallery-indicator.js
@@ -58,10 +58,10 @@
                 thumbnail;
             if (this.options.thumbnailIndicators) {
                 thumbnail = obj.getElementsByTagName && $(obj).find('img')[0];
-                if (thumbnail) {
-                    thumbnailUrl = thumbnail.src;
-                } else if (thumbnailProperty) {
+                if (thumbnailProperty) {
                     thumbnailUrl = this.getItemProperty(obj, thumbnailProperty);
+                } else if (thumbnail) {
+                    thumbnailUrl = thumbnail.src;
                 }
                 if (thumbnailUrl) {
                     indicator.style.backgroundImage = 'url("' + thumbnailUrl + '")';
             }

然后将此更改传播到任何缩小的文件。