2

「PriceisRight」タイプのホイールまたはスタイルのUIPicker機能をエミュレートするためのいくつかの方法について議論していました。つまり、UIPickerプラグインのダイアログ全体と配色は必要ありません。ホイールの回転を再現するには、いくつかの画像をアニメーション化できる必要があります。

例として、これが私のリストであるとしましょう:
1984
1985
1987
1990
1994

そして、これらの番号が画面に表示されているとしましょう。

1985
1987
1990

ユーザーが1990をクリックすると、リストがスライドして1985が画面から消え、1994が画面に表示されます。私たちを残して:

1987
1990
1994

次に、ユーザーが1994をクリックすると、リストが再び上にスライドし、1987が画面を離れ、1984が画面に表示されます。あるいは、リストを下にスライドさせることもできます...では、これを実現するための好ましい方法は何でしょうか。無限のスクローラーと、上下にスライドして新しい組み合わせに交換して準備ができる各組み合わせの特大画像のセット(画面上のセクションを制限するために小さなdiv内にある)について議論しました。次の選択。

4

1 に答える 1

2

これを成功させるには、いくつかの方法があると思います。個人的には、insertAfterを使用して最初の項目を取得し、それを最後に追加すると同時に、リストの相対位置を変更するjQueryanimateのコールバックがあります。これは機能し、ほんの数行のコードですが、どの程度スムーズにするかによって異なります。

何かのようなもの:

var $length = $('.list li').length--;
$('#foo').click(function(){
    $('.list').animate({
        top:'-30px'     
    },function(){
        $('.list li').eq(0).insertAfter($('.list li').eq($length));
        $('.list').css('top','0px');
    });
});

動作しますが、頭のてっぺんから外れているので、おそらくもっとスムーズな方法があります。

于 2012-09-24T15:12:51.587 に答える