0

私は次のものを持っています：

var player = $('#player');
//Checks to see which key is pressed down

$(window).on('mousedown', function (e) {
    console.log(e.offsetX + ', ' + e.offsetY);

    player.animate({
        left: e.offsetX + 'px',
        top: e.offsetY + 'px'
    }, 500);
});

私が達成しようとしているのは、画面のどこかをクリックすると画像がその位置に移動することですが、移動アニメーションの途中でもう一度クリックすると、実行する代わりに最後にクリックした場所に移動するはずです最初のアニメーションを最初に。

フルフィドル

ありがとうございました！

4

2 に答える 2

1

player.stop(false);の前に呼び出しplayer.animate(...);ます。プレーヤー オブジェクトの現在実行中および待機中のアニメーションを停止します。

于 2013-10-24T22:27:11.660 に答える
0

複数のクリックを処理するには、別の関数によって制御される関数の配列であるプールを作成する必要があります。したがって、本文をクリックすると、画像を移動する新しい関数が追加されます。

以下に、関数の配列を作成してプッシュする方法に関するコードを示します。

var listRuns = [],
    ind = 0;

$('#btnRun').click(function(){
  var message = document.getElementById("txtMsg").value;

  listRuns.push(function(){
    run(message);
  });
});

次に、以下に示すように、この配列の実行を制御する別の関数が必要です。

var runAll = function(){  
  if (listRuns.length>ind){
    listRuns[ind]();
    ind++; 
  }
};

var idInterval = setInterval(function(){
  runAll();
},1000);

したがって、実行のポーリングを作成します。この例を見て、より詳細な情報を確認してください。

于 2013-10-24T22:14:13.597 に答える