CarouFredSel动态添加内容

Question

我尝试动态添加内容到CarouFredSel滑块。内容插入正常，但CourFredSel无法识别新内容。有没有办法告诉滑块幻灯片计数是否已更改？

jQuery(document).ready(function() {
    jQuery('#carousel').carouFredSel({
        items: 4,
        direction: "left",
        responsive: true,
        infinite: false,
        circular: false,
        scroll: {
            items: 2,
            duration: 1000
        },
        next: {
            button: "#slider-button-next",
            key: "right",
            onBefore: function () {
                loadAdditionalContent();
            }
        },
        prev: {
            button: "#slider-button-prev",
            key: "left"
        },
        auto: {
            play: false
        }
    });
});

function loadAdditionalContent () {
    jQuery('#carousel').trigger('insertItem', ['<img src="http://dummyimage.com/200x200" class="added" />']);
}

这是一个描述问题的小提琴：http://jsfiddle.net/bg0xyj8k/

Answer 1

您的代码没有任何问题：

在jsfidle中解决此问题：使用不带https的外部引用：http://cdnjs.cloudflare.com/ajax/libs/jquery.caroufredsel/6.2.1/jquery.carouFredSel.packed.js

我对您的代码进行了一些更改，但没有理解您要在那里做什么。

jQuery( "#slider-add-items" ).click(function() {
  loadAdditionalContent();
});

function loadAdditionalContent () {
    id++;
    jQuery('#carousel').trigger('insertItem', ['<img src="http://dummyimage.com/200x200" class="added" id="'+ id +'" />']);
}

http://jsfiddle.net/bg0xyj8k/2/

<强>更新 - 当你问某些事情时更准确

FIX 1：在第一个可见元素 - http://jsfiddle.net/bg0xyj8k/3/

之前插入

FIX 2：在下次点击时插入滑块的最后位置 - http://jsfiddle.net/bg0xyj8k/4/ - result =＆gt;无限下一次点击