carouFredSel:如何使幻灯片褪色

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高级配置文档:

滚动{fx:"滚动"}

指示要用于转换的效果.

可能的值: "none","scroll","directscroll","fade","crossfade","cover","cover-fade","uncover"或"uncover-fade".

他们的网站上还有一个这样的演示.