カウントダウンを機能化するには？

Question

私はカウントダウンタイマーを作成し、これをHTMLとCSSでコーディングしましたが、jQueryを使用して機能させることができませんでした。このカウントダウンを機能化するにはどうすればよいですか？あなたが見ることができるように

<div id="counter-container"> 
     <div class="counter-box"> 
     <div class="counter"><p class="counter-p">#</p></div> 
     <p class="counter-box-p">days</p> 
     </div> 
     <div class="counter-box"> 
     <div class="counter"><p class="counter-p">#</p></div> 
     <p class="counter-box-p">hours</p> 
     </div> 
     <div class="counter-box"> 
     <div class="counter"><p class="counter-p">#</p></div> 
     <p class="counter-box-p">minutes</p> 
     </div> 
     <div class="counter-box"> 
     <div class="counter"><p class="counter-p">#</p></div> 
     <p class="counter-box-p">seconds</p> 
     </div> 

、私はすでに、日、時間などのための段落要素を追加したので、私はjQueryの経由余分なテキストを埋め込むにしたくない：ここで私はカウントダウンがであることを好むHTML構造があります。

P.S.誰も新しいカウントダウンの日付を設定する方法を教えてもらえますか？

Answer 1

function counter(count) { 
    countdown = setInterval(function(){ 
    var temp; 
    $("p#d").html(Math.floor(count/(60*60*24))); 
    temp = count%(60*60*24); 
    $("p#h").html(Math.floor(temp/(60*60))); 
    temp = count%(60*60); 
    $("p#m").html(Math.floor(temp/(60))); 
    temp = count%(60); 
    $("p#s").html(temp); 
    if (count == 0) { 
     alert("time's up"); 
     clearInterval(countdown);  
    } 
    count--; 
    }, 1000); 
} 

counter(60*60*24*2); 

demo

EDIT-1：

カウンタ秒として時刻を取得します。

counter(10); //10 seconds 
counter(10*60) //600 seconds -> 10 minutes. 
counter(10*60*60) //36000 seconds -> 600 minutes -> 10 hour 

EDIT-2：あなたが実装しようとしましたあなたはそれがベースDateを動作するように、あなたはこのような機能を変更すべきかどう

、

function counter(futureDate) { 
    var today = new Date(); // today 
    count = Math.floor((futureDate-today)/1000); 
    countdown = setInterval(function(){ 
    var temp; 
    $("p#d").html(Math.floor(count/(60*60*24))); 
    temp = count%(60*60*24); 
    $("p#h").html(Math.floor(temp/(60*60))); 
    temp = count%(60*60); 
    $("p#m").html(Math.floor(temp/(60))); 
    temp = count%(60); 
    $("p#s").html(temp); 
    if (count == 0) { 
     alert("time's up"); 
     clearInterval(countdown);  
    } 
    count--; 
    }, 1000); 
} 

counter(new Date(2012,4,8)); // May 8, 2012 00:00:00 
/* counter(new Date(2012,4,8,15,49,10)); // May 8, 2012 15:49:00 */ 
​ 

http://jsfiddle.net/NfLAB/1/