2

私は現在、小学生向けの新しい数学ゲームを作成するための調査を行っています。このゲームでは、0〜9のdivがコンテナ内にランダムに表示されます。

最初に質問があります。20の倍数のようなものです。次に、ユーザーは正しいものをクリックする必要があり、最後にカウントされ、スコアが与えられます。

divが表示される速度を変更して、一度に複数のdivが表示されるようにし、幼い子供がゲームを簡単に行えるようにしました。

私はそのように「fadeIn」を使用しました。

    $('#' + id).animate({
        top: newY,
        left: newX
    }, 'slow', function() {}).fadeIn(2000);
}

私の問題は、正しい番号または間違った番号を撮影すると、アニメーションが非常にグリッチになり、その理由がわからないことです。

フィドル： http： //jsfiddle.net/cFKHq/6/（以前の状態についてはバージョン5を参照してください）

4

1 に答える 1

2

内部startplay()では、呼び出し時に同時実行性を制御しscramble()ます。これは、という名前のグローバル変数を使用して行うwindow.contため、次の呼び出しを置き換えました。

play = setInterval(scramble, 1800);

これのために：

play = setInterval(function() { 
          if (window.cont){ 
              window.cont = false;
              scramble();
          }
}, 1000);

varwindow.contは、次のように、コードの開始時にグローバルに設定する必要があります。

var miss = 0;
var hit = 0;
var target = $("#target");
window.cont = true;

これで、window.cont次のように、アニメーションが重複することなく次々に実行されるように制御できます。

$('#'+id).css({
    top: newY,
    left: newX
}).fadeIn(2000, function() {
      setTimeout(function() {
        $('#' + id).slideUp('fast');
        window.cont = true;
      }, 1500);
});

作業デモを見る

于 2012-10-23T09:31:12.953 に答える