Question

我遇到了一个问题，即只有div的第一个附加元素才会显示为＆＃39; slick＆＃39;旋转木马。

        $('.multiple-items').append('<div class="iimg"><img src="'+logo+'"><p>'+streamName+' is playing '+game+'</p><p>Viewers: '+viewers+'</p></div>');


        });

和

        if (dataOffline.logo !== null){
            $('.offline').append('<div class="iimg"><img src="'+dataOffline.logo+'"></div>');
        } 

            else {
            $('.offline').append('<div><img src="http://placehold.it/150x150"></div>');
        }

是两个getJSON请求的回调函数的摘录。在每种情况下，我都附加了一个包含图像的div和第一个中的段落以及第二个中的图像。完成这些操作后，我致电

$('.multiple-items').not('.slick-initialized').slick();
$('.offline').not('.slick-initialized').slick();

然而绝对没有任何反应。在早期版本中，光滑的轮播工作正常，因此我的html代码中的链接没有问题。任何人都可以建议我如何获得两个整洁的旋转木马？感谢

Answer 1

如果您的轮播已初始化，则可以使用goto_，否则您可以附加图像然后初始化。对于离线轮播，它可能看起来像：

slickAdd

Answer 2

初始化轮播后，操纵DOM。添加了箭头，圆点，类和许多其他内容。

如果添加图像，则必须取消初始化整个轮播。

// this will work
$('.multiple-items').slick();
$('.multiple-items').slick('unslick');
$('.multiple-items').append('<img src="...">');
$('.multiple-items').slick();

光滑的轮播仅显示第一项

2 个答案: