2

私には長期的な目標があり、それに向かってゆっくりと進んでいますが、多くの助けが必要です。まだ何をしているのか本当にわかりませんか?

このフィドルを見てください:http://jsfiddle.net/bloodygeese/vjU5b/27/

私の最終的な目標は、正方形が右に回転するときのように、赤い正方形でリストの位置を制御することです (時計回りにリストが下に移動して、青いボックス領域内に新しいテキスト行が表示されます。リストに到達すると、動きが逆になり、正方形が左 (反時計回り) に回転し、リストが上にスライドして青いボックス内にテキスト行が表示されます。赤い四角の周りにマウスを置いて四角を回転させ、リストを上下にスライドさせて所定の位置にスナップし、テキストが青いボックス内に収まるようにします。

現時点では、正方形が回転するにつれてリストを動かし続けることができず、一度だけ移動します。それ以降、リストを逆にする方法や、マウスドラッグを使用して制御する方法がわかりません。

ポインタ/ヘルプをいただければ幸いです。

4

3 に答える 3

2

リストを移動し続けるには、次のものが必要です。

$('#list').animate({top : "+=20px"}, {duration:500})

それ以外の

 $('#list').animate({top : "=120px"}, {duration:500})

2 番目のステートメントは top:120px にのみ配置しますが、最初のステートメントはクリックするたびに位置を 20 ピクセルずつ減らします。

方向を変えるには、このようにできますjsfiddle

于 2012-09-19T02:06:46.843 に答える
1

次のように、毎回リストの先頭を変更する必要があります。

var top = 120;

$(function(){
$('#box').click(function(){
    $('#list').animate({top : top + "px"}, {duration:500});
    top = top + 20;        
})
于 2012-09-19T02:06:55.763 に答える
0

それを達成する方法のこの小さな例を確認してください。私は完全なコードを書いていません..

フィドル

于 2012-09-19T02:27:46.013 に答える