如何使 carouFredSel 自动播放和同步？

Question

我有旋转木马（我认为它是由引导程序制成的），它是从 themeforest 的模板中派生的。在我想让它自动播放之前它运行良好。我试过设置interval:1000，但还是不行。这是脚本：

function InitPropertyCarousel() {
    if ($('.carousel.property .content li img').length !== 0) {
        $('.carousel.property .content li img').on({
            click: function(e) {
                var src = $(this).attr('src');
                var img = $(this).closest('.carousel.property').find('.preview img');
                img.attr('src', src);
                $('.carousel.property .content li').each(function() {
                    $(this).removeClass('active');
                });
                $(this).closest('li').addClass('active');
            }
        });
    }
}

这是示例链接：http://preview.byaviators.com/template/realia/detail.html。 （我尝试将此代码放在 jsfiddle 上，但它不起作用。）

Answer 1

我认为您正在使用此轮播carouFredSell。而真正的初始化代码是这样的：

function InitCarousel() {
if ($('#main .carousel .content ul').length !== 0) {
    $('#main .carousel .content ul').carouFredSel({
        scroll: {
            items: 1
        },
        auto: false,
        next: {
            button: '#main .carousel-next',
            key: 'right'
        },
        prev: {
            button: '#main .carousel-prev',
            key: 'left'
        },
        //try if this fires after slide event ends
        onAfter: function () {
            var src = $(this).find('img').attr('src');
            var img = $(this).closest('.carousel.property').find('.preview img');
            img.attr('src', src);
            $('.carousel.property .content li').each(function() {
                $(this).removeClass('active');
            });
            $(this).closest('li').addClass('active');
        }
    });
}

if ($('.carousel-wrapper .content ul').length !== 0) {
    $('.carousel-wrapper .content ul').carouFredSel({
        scroll: {
            items: 1
        },
        auto: false,
        next: {
            button: '.carousel-wrapper .carousel-next',
            key: 'right'
        },
        prev: {
            button: '.carousel-wrapper .carousel-prev',
            key: 'left'
        }
    });
}
}

你有选项auto:false，尝试将它设置为'true`。如果这是您使用的滑块，您可以从上面的链接中查看文档。