0

私のゲームでは、タイマーを 30000ms (30 秒) に設定しました。タイマーが終了すると、ゲームは終了します。ユーザーにタイマーを表示して、残り時間がわかるようにしたいと思います。これを行うにはどうすればよいですか、次のようにしようとしました：

setTimeout(function() {
                    $("#message").html('Thank you for playing. </br> You answered </br>' + hit + '/' + attempted + ' correctly. </br> Press "Play" to start again.').fadeIn('slow');
                    $(".character").fadeIn('slow');
                }, 500);
            });
        }, 30000).show('#timer'); //here I am trying to display the time in the "#timer"
    }

私はこれに完全に間違って近づいていると思います。誰かが私に正しい方向にポイントを与えることができますか?

フィドル: http://jsfiddle.net/cFKHq/8/

4

7 に答える 7

1

このjsFiddleを見てください。に変更timeoutしてinterval、秒数を記録するだけです。

于 2012-10-23T13:33:30.037 に答える
0

以下に例を示します: http://jsfiddle.net/RPSMJ/4/

JavaScript

var counter = 30,
    timerOutput = document.getElementById('timerOutput');
(function timer() {
    timerOutput.innerHTML = counter;
    counter -= 1;
    if (counter >= 0) {
        setTimeout(function () {
            timer();
        }, 1000);
    }
}());​

HTML

<div id='timerOutput'></div>​
于 2012-10-23T13:24:23.847 に答える
0

window.durationゲームが続く秒数を設定した場合、グローバル変数を使用して、「1 秒」の間隔でそれから減少させることができます。

実際のデモを見る

スクリプトの開始時:

var hit = 0;
var attempted = 0;
var target = $("#target");
window.cont = true;
window.duration = 30; //set your desired game duration in seconds

次に、「1 秒間隔」でタイマーをデクリメントし、タイマー テキストを出力します。

     play = setInterval(function() {
        if (window.cont) {
            window.cont = false;
            scramble();
        }
        window.duration--;
        $('#timer').html(window.duration + ' seconds to go');
    }, 1000);

また、ゲーム終了時に「終了」テキストを表示します。関連する部分は次のとおりです。

setTimeout(function() {
                    $("#message").html('Thank you for playing. </br> You answered </br>' + hit + '/' + attempted + ' correctly. </br> Press "Play" to start again.').fadeIn('slow');
                    $(".character").fadeIn('slow');
                    $('#timer').html('Finished');
                }, 500);
于 2012-10-23T13:35:50.800 に答える
0

一度に 30000 単位でタイマーを実行する代わりに、タイマーを 1000 ミリ秒単位で実行します。ヒットするたびにカウンターから 1 を引き、ページを更新し、カウンターが 0 の場合はゲームを終了します。

于 2012-10-23T13:19:16.300 に答える
0

タイマーは関係なく刻む必要があるため、タイマーロジックを「ゲームオーバー」ロジックから分離する必要があります。

var secondsLeft = 30;
var timerElement = $('#timer');

(function timer() {
    timerElement.text(secondsLeft);
    secondsLeft--;

    if (secondsLeft !== 0) {
        setTimeout(function () {
            timer();
        }, 1000);
    }
}());

http://jsfiddle.net/cFKHq/14/

このソリューションでは、30 * 1 秒のタイマー カウントダウンと 30 秒のゲームプレイは相互に関連または依存していないことに注意してください。ユーザーが低速のマシンを使用している場合、同期の問題が発生する可能性があります。

于 2012-10-23T13:47:14.427 に答える
0

あなたが投稿したjsfiddleを、再生ボタンを押した後にカウンターを表示するように変更しました。http://jsfiddle.net/cFKHq/10/を参照

関数内に初期値 30 のstartplay()変数を追加し、毎秒呼び出される引数関数に行を追加しました。ttime$("#timer").text(--ttime);setInterval

于 2012-10-23T13:33:13.480 に答える
0

デルタ時間の使用を検討してください。これは、時間の変化を測定する必要があるものを処理するための優れた方法であることがわかりました。

prevTime = curTime;
curTime += new Date();
deltaTime = curTime - prevTime;

これにより、1 秒ごと、さらには 100 ミリ秒ごとにイベントを発生させた場合に、「残り x 秒」カウンターを持つこともできます。すべては、どれだけ速くしたいかによって異なります。

于 2012-10-23T13:34:00.130 に答える