Question

$('.rotateme').cycle({fx:'fade',speed:2500,timeout:3000,next:'#arrowright',prev:'#arrowleft',sync:1,pause:1});

Hai dudes，上面的代码是我用于图像滑块的地方，图像在一个周期中淡出（很明显）。

无论如何，这是发生的事情：

当它在li元素中循环时，前一个按钮会将我返回到刚刚淡出的li元素，然后继续向下移动。

我想要发生的事情：

我想让前一个按钮返回上一个元素并反转方向，所以它不会再回到列表中，而是会上升。

显而易见的解决方案是使用：

为#arrowright单独绑定

rev:           0,     // causes animations to transition in reverse

这在一定程度上有效并且在这里失败：如果我再次点击#arrowright，它将再次反转方向（doh），这意味着#arrowright实际上是一个切换按钮，我不需要它。 ..

有什么建议吗？

Answer 1

//此片段会将“selected”类添加到“#arrowRight”，并从“#arrowLeft”中删除“selected”类。然后，当你运行.cycle（）时，它将看到“#arrowRight”是否具有“已选择”类，如果这是真的，则.cycle（）将在没有rev：0变量的情况下运行。否则，它将正常反转。当用户点击“#leftArrow”时，将删除“已选择”类。

if($("#arrowRight").hasClass("selected")) {

$('.rotateme').cycle({
    fx:'fade',

    speed:2500,
    timeout:3000,
    next:'#arrowright',
    prev:'#arrowleft',
    sync:1,pause:1 

});
}


else{
$('.rotateme').cycle({
    fx:'fade',

    speed:2500,
    timeout:3000,
    next:'#arrowright',
    prev:'#arrowleft',
    sync:1,pause:1
    rev: 0
});
}


$("#arrowRight").click({
    $(this).addClass({"selected"}); 
    $("#arrowLeft").removeClass({"selected"});
});


$("#arrowLeft").click({
    $(this).addClass({"selected"}); 
    $("#arrowRight").removeClass({"selected"});
});

jQuery循环淡入淡出顺序变化

1 个答案: