2

カウントダウンのスクリプトを書いています

http://jsfiddle.net/yv4H4/

問題の 1 つは、数秒から読みやすい 0:00 になることです。

もう1つの問題は、カウントダウンが始まるまでにかかる時間です

編集：少しphpと混同したと思います

window.onload = function() {
    canvas  = document.getElementById('timer'),
    seconds = document.getElementById('counter'),
    ctx     = canvas.getContext('2d'), 
    sec     = seconds.innerHTML | 0,
    countdown = sec;

ctx.lineWidth = 8;
ctx.strokeStyle = "#528f20";

var 
startAngle = 0, 
time       = 0,
mins       = 0,
secs       = 0,
intv       = setInterval(function(){

    // Making 180 look like 3:00 is not working 
    if(sec > 59)
{
    mins = Math.floor(sec/60);
    secs = Math.floor(sec - mins*60);


    if(mins < 10) mins = "0" + mins;
    if(secs < 10) secs = "0" + secs;
}

    var endAngle = (Math.PI * time * 2 / sec);
    ctx.arc(50, 50, 35, startAngle , endAngle, false);   
    startAngle = endAngle;
    ctx.stroke();

    seconds.innerHTML = countdown--;

    if (++time > sec) { clearInterval(intv); }

}, 1000);
4

1 に答える 1

2

カウントダウンの遅延はwindow.onload、ページのすべてのコンテンツが読み込まれたときにのみ発生するイベントにリンクされているために発生します (したがって、開始までに時間がかかります)。より速く起動したい場合は、DOM Ready イベントを調べることをお勧めします。（たとえば、このように）。

「より読みやすい0:00」については、簡単な解決策でjsFiddleを作成しました。

countdown--;
seconds.innerHTML = Math.floor(countdown/60);
seconds.innerHTML += ":" + countdown%60;

これは、現在の時刻を 60 で割ったもの (および最も近い整数に切り捨てたもの) を分として、その分割の逆数を秒として取ります。

于 2012-10-29T00:28:03.317 に答える