javascript - Jssor 动态缩略图不起作用

Question

我正在尝试制作一个基于 Instagram feed 的 jssor 画廊。到目前为止，图像成功，但缩略图尚未成功。

var img = '<img u="image" src="'+thisMedia.images.standard_resolution.url+'" alt="Instagram Image" data-filter="'+thisMedia.filter+'" width="720" height="480" />';
var thumb = '<img u="thumb" src="'+thisMedia.images.standard_resolution.url+'" width="99" height="66"/>';

$('#slide-'+i+'').html(img);
$('#slide-'+i+'').append(thumb);

这种情况发生在 instafeed 文件中，到目前为止，img 在图库中运行良好，但在拇指中则不然。我还尝试将拇指代码放在 img 变量的同一行中。

当我在浏览器中打开它并检查发生了什么时，我看到图像和缩略图已正确放入所需的 div 幻灯片中。尽管缩略图应该由 jssor 代码处理，但它们只是坐在那里，但我基本上复制了演示版本的代码。知道发生了什么吗？

Answer 1

在原始 html 中，幻灯片的缩略图按以下格式定义。

        <div>
            <img u="image" src="../img/alila/01.jpg" />
            <img u="thumb" src="../img/alila/thumb-01.jpg" />
        </div>

当 jssor slider 初始化时，它会隐藏幻灯片中的缩略图并将克隆复制到缩略图导航器。实际上，缩略图导航器是一种 slider 。

您可以检查元素以查看其排列方式。如果需要替换缩略图，请在缩略图导航器中操作元素。