jquery - 具有淡入淡出效果的 JQuery jCarouselLite 插件

Question

祝福大家...

我想使用 jCarouselLite 品质的淡入淡出效果。是否可以。

需求：

1. 图像转换时间应该很快。
2. 图像必须停留 10 秒。

任何人都可以为此指导我。

吉萨。

Answer 1

要从“图像到图像”而不是“图像到白色到图像”淡出，您应该将速度属性设置为零，例如

$('#content .slider .inner')
    .jCarouselLite(
    {
        afterEnd    : function(el) { $(el).parent().fadeTo(500, 1); },
        beforeStart : function(el) { $(el).parent().fadeTo(500, 0); },
        speed       : 0
    }
);

Answer 2

嗯...也许我误解了你想要什么。但是 jCarousel Lite 不支持您要求的哪些内容？

• 淡入淡出效果：使用该easing选项（您需要包含jQuery easing 插件）。检查自定义动画 - 缓动演示（在页面右侧）
• 快速过渡：speed选项（毫秒）确定过渡动画的速度
• 显示图像 10 秒：auto选项。这样，轮播自动滚动，您以毫秒为单位指定的时间是两个连续幻灯片之间的时间

---

在此处查看演示：http: //jsbin.com/etena/（在此处观看代码http://jsbin.com/etena/edit）

Answer 3

你不能。使用 easing 你只能设置它滑动的方法，但 jCarousselLite 总是会滑动。

当然，您可以更改插件的默认行为以满足您的特定需求。此处的示例：http: //snipplr.com/view/18326/jcarousellite-fade-animation/（我没有对此进行测试，但看起来还可以）

Answer 4

你不能用缓动来做到这一点。基于/简化 publicJorn 所写的内容，这是一种在滑动时添加淡入/淡出效果的方法：

$('div#foo').jCarouselLite({
    visible: 1,
    start: 0,
    beforeStart: function(a) {
            $(a).parent().fadeTo(500, 0);
    },
    afterEnd: function(a) {
            $(a).parent().fadeTo(500, 1);
    }
});