使用jQuery Cycle 2进行可变幻灯片超时

时间:2013-03-07 13:00:52

标签: jquery jquery-cycle

我正在尝试设置幻灯片,以使用数据属性在每张幻灯片上设置超时。这适用于jQuery Cycle,但不适用于 jQuery Cycle 2 。我想我可能使用了错误的功能,但在Cycle 2 docs中找不到类似的东西?

HTML:

<div id="slides">
    <img src="img1.jpg" data-duration="1000" />
    <img src="img2.jpg" data-duration="2000" />
    <img src="img3.jpg" data-duration="3000" />
</div>

JS:

$('#slides').cycle({
    fx: 'fadeout',
    speed: 250,
    timeoutFn: function(currElement, nextElement, opts, isForward) { 
        return parseInt($(currElement).attr('data-duration'), 10);
    }
});

1 个答案:

答案 0 :(得分:10)

Cycle2直接支持。在幻灯片上使用data-cycle-timeout属性而不是data-duration