javascript - carouFredsel 中的暂停事件

Question

我在使用轮播时遇到问题。我想向轮播添加暂停或停止事件。我已经构建了一个 slider ，在左侧有一个 slider 的导航页面。 slider 自动启动，如果我手动选择幻灯片，我希望它停止

这是我的代码:

感谢您的任何提示。

  jQuery(this).parent().find('.navigation>ul>li').eq(0).addClass('active').end().each(function(){
                    jQuery(this).on('click', function(){
                        jQuery(this).parents('.csc-slider').find('.pager>a').eq(jQuery(this).index()).trigger('click');
                        return false;
                    });
                });
                var swidth = jQuery(this).width(); 
                jQuery(this).find('img')
                            .width(swidth +'px !important')
                            .eq(0)
                            .imagesLoaded()
                            .done(function($images){
                    jQuery($images).parents('.slideshow')
                                   .find('.item')
                                   .css({display:'block', float:'left'})
                                   .end()
                                   .carouFredSel({
                        width: "100%",
                        height: "variable",
                        items: {
                            visible: 1,
                            height: "auto"
                        },
                        scroll: {
                        fx          : "crossfade",
                        duration    : 5000,
                                    onAfter:function(data) {
                                    var p = jQuery(this).parents('.csc-slider');
                                    var i = p.find('.pager>a.selected').index();
                                    p.find('li.active').removeClass('active');
                                    p.find('.navigation>ul>li').eq(i).addClass('active');
                                }},
                        auto: {
                                pauseOnHover: "resume",
                                pauseOnEvent: true,
                                timeoutDuration: 5000,

                        },
                        prev: {
                            button: jQuery($images).parents('.csc-slider').find('.prev'),
                        },
                        next: {
                            button: jQuery($images).parents('.csc-slider').find('.next'),
                        },
                        pagination: jQuery($images).parents('.csc-slider').find('.pager'),

                    });

Answer 1

您可以向导航按钮添加点击事件来停止自动滚动:

$(".slider-pages .prev, .slider-pages .next, .slider-nav a").click(function(){
        carouFredselObject.trigger("configuration", {auto: false});
});