Question

我在CarouFredSel中使用此代码它工作正常，现在我想让它淡化而不是从左到右滑动。

jQuery(document).ready(function($) {
    $("#slider_home").carouFredSel({
        width : "100%",
        height : "auto",
        responsive : true,
        circular : true,
        infinite : false,
        auto : false,
        swipe : { onTouch : true, onMouse : true },
        prev : { button : "#sl-prev", key : "left"},
        next : { button : "#sl-next", key : "right" }
    });
});

Answer 1

您需要在设置轮播时设置scroll fx属性。

jQuery(document).ready(function($) {
    $("#slider_home").carouFredSel({
        width : "100%",
        height : "auto",
        responsive : true,
        infinite  : false,
        auto : false,
        swipe : { onTouch : true, onMouse : true },
        prev : { button : "#sl-prev", key : "left"},
        next : { button : "#sl-next", key : "right" },
        scroll : { fx : "crossfade" },
        items: 1
    });
});

来自carouFredSel Advanced Configuration documetation：

滚动{fx：“滚动”}

指示要用于转换的效果。

可能的值：“none”，“scroll”，“directscroll”，“fade”，“crossfade”，   “封面”，“封面淡化”，“揭露”或“揭开褪色”。

他们的网站上还有一个demo of this。

Answer 2

您可以使用

 scroll      : {
            items           : null,     //  items.visible
            fx              : "scroll",      // its use animation of slide
            easing          : "swing",
            duration        : 500,
            pauseOnHover    : false,
            queue           : false,
            event           : "click",
            conditions      : null,
            onBefore        : null,
            onAfter         : null,
            onEnd           : null
        },

carouFredSel：如何使幻灯片褪色

2 个答案: