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

こんにちは、上記のコードは、画像がサイクルでフェードする画像スライダーに使用しているものです (それは明らかでした)。

とにかく、これは何が起こるかです:

要素を循環しているときに、前のボタンを押すと、フェードアウトしたばかりliの要素に戻り、リストを下に続けます。li

私がしたいこと:

前のボタンで前の要素に戻り、方向を逆にしたいので、リストを下に戻るのではなく、上に移動します。

#arrowright明らかな解決策は、使用するために別のバインドを作成することです。

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

これはある程度機能しますが、ここでは失敗します。もう一度クリック#arrowrightすると、方向が再び逆になります (doh)。これ#arrowrightは実際にはトグル ボタンであり、必要ありません...

助言がありますか?

4

1 に答える 1

1

//このスニペットは、クラス「selected」を「#arrowRight」に追加し、クラス「selected」を「#arrowLeft」から削除します。次に、.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"});
});
于 2009-09-24T13:33:44.970 に答える