• ベストアンサー

Javascriptでカウントダウン

急いでいます。 Javascriptで、アクセスして読み込まれるとき、読み込まれてから20秒だけカウントダウンしたいのですが、どのようにすればよいのか分かりません。 初めに20と表示され、19,18,17,16, ..... 3,2,1,0で終わるようなカウントダウンタイマーを作りたいんです。できれば２桁だけ小数も表示させたいです。19.04 19.03 19.02 19.01 19.00 ..... よろしくおねがいします。

質問者が選んだベストアンサー

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

一例です。 <html> <head> <script type="text/javascript"> window.onload = function(){dt = new Date(); count();} function count() { var t, tm = '00:00', tmp = 20000 - (new Date()-dt); if (tmp>0) { t = Math.floor(tmp/1000), tm =(t<10?('0'+t):t)+':'; t = Math.floor(tmp/10)%100, tm += t<10?('0'+t):t; setTimeout(count,10); } document.getElementById('countdown').innerHTML = tm; } </script> </head> <body> <div id="countdown">20:00</div> </body> </html>

JIFT00
質問者

お礼

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

  1. カテゴリ
  2. パソコン・スマートフォン
  3. ソフトウェア
  4. ホームページ作成ソフト

関連するQ&A

  • javascriptを用いたカウントダウンタイマ-

    javascriptを用いた、カウントダウンタイマーの方法を教えて頂けないでしょうか？ 【午前9時からカウント開始】（あと”9時間59分59秒") 　　　　　　↓ 【午後19時に終了】（あと”0時間00分00秒") ※毎日繰り返し （午後19時から午前9時までの間は、何かコメントを表示させておく。） このようなカウントダウンも出来るものなのでしょうか？ 超初心者ですが、独学で勉強したくて色々見てますが…、難しくてなかなか…。 どなたか、お知恵を貸して頂けたら、幸いです。 宜しくお願いします。

  • Javascriptのカウントダウンについて

    現在、カウントダウンタイマーをJavascriptで書いておりますが、質問させて下さい。 例えば朝７時からカウントダウンを開始し、夕方４時になったら「カウントダウン終了！次回のカウントダウンは○月○日（○曜日）です！」とコメントさせて次回のカウントダウン日時（朝７時）になったら、自動でまたカウントダウンさせたい（夕方４時にカウントダウン終了）のですが、どうすれば出来るのでしょうか？m(_ _)m ちなみに○月○日（○曜日）の部分は基本的に次の日にさせたいのですが、次の日が日曜日や祝日の場合はそれを除いた次の日を表示させたいです。 これはJavaScriptで出来ますか？ JavaScriptのコードはここを参考に引用しています。 http://javascript123.seesaa.net/article/102586838.html どなたか教えてください。よろしくお願いいたします。

  • javascript カウントダウンタイマーについて

    下記のサイトのようなカウントダウンタイマーを作成したく 色々と検索してるのですが全然見つかりません。 http://www.countdownbooster.com/ このサイトのように100分の1秒まで表示させて 例えば期限を明日と数字で設定するのではなく サイトに訪れてから●日後や●分後を期限にしたいのです。 尚且つクッキーで期限が切れたら何度訪れても終了！と表示させたいのですが可能でしょうか？ 下記のサイトが訪れてから1週間後に終了と表示されるサイトです。 http://www.successlab.jp/u25/full/ ※但し、100分の1秒まで表示されてません。 例えば7月31日と指定して 残り8日と●時間●分●秒●と 表示出来るJavaScriptはあるのですが 上記のような全てを満たすJavaScriptがありません。 ご存じの方がいたら是非、力をお貸し下さいませんか？ 宜しくお願い致します。

  • javascriptでカウントダウンタイマー

    「○時間○分○秒○」 のように、時間から秒以下までを カウントダウンするjavascriptを探しているのですが、 「○日○時間○分○秒○」 のように、日付からカウントダウンする javascriptしか見つけることができません…。 時間からカウントダウンを開始できる javascriptを教えて頂けないでしょうか。 可能であればキャンペーン開始前、終了後に ひとこと設定できると嬉しいです。 （例えば「キャンペーンは終了しました。」など） よろしくお願い致します。

  • カウントダウンJavascript　

    Javascriptでホームページにカウントダウンを設置しょうと思っているのですが… やはり、こったモノをと本などを買って勉強しています。 そこでお尋ねしたいのですが、残り　○日○時間○分○，○○秒といったように ○，○○秒というのはできるんでしょうか？よろしくお願いします。

  • javascriptでカウントダウンタイマーを…

    javascriptを用いた、カウントダウンタイマーの方法を教えて頂けないでしょうか？ 【午前9時からカウント開始】 　　　　　　↓ 【午後19時に終了（0）】 ※毎日繰り返し このようなカウントダウンも出来るものなのでしょうか？ 超初心者ですが、独学で勉強したくて色々見てますが…、難しくてなかなか…。 どなたか、お知恵を貸して頂けたら、幸いです。 宜しくお願いします。

  • javascriptカウントタイマー設置について

    javascriptに関する質問です。 ページにアクセスすると残り30分からスタートし、 リロードをしてもアクセスし直しても時間は元に戻ることなく、 30分経過後はずっと00分00秒00のままのカウントダウンタイマーって どう作ればいいのでしょう？ Javascript全く分からないんでご教授頂ければ幸いです。

  • PHPとjavascriptを融合させたカウントダウンを作りたい

    PHPとjavascriptを融合させたカウントダウンを作りたい 宜しくお願い致します。 現在、アクセスした時刻から時計が「0秒」を指すまでのカウントダウンを 表示させているのですが、 これを、PHPで取得したサーバー時刻を使ったカウントダウンにしたい と思っています。 現在、利用しているjavascriptは、 －－－－－－－－－－－－－－－－ <script type="text/javascript"> <!-- function tokei() { date=new Date(); second=date.getSeconds(); var str=60-second; document.getElementById("tokei").innerHTML=str; } //--> </script> <body onload="window.setInterval('tokei()',100)"> －－－－－－－－－－－－－－－－ なのですが、これを、 －－－－－－－－－－－－－－－－ <script type="text/javascript"> <!-- function tokei() { second=<?php print date(s) ?>; var str=60-second; document.getElementById("tokei").innerHTML=str; } //--> </script> <body onload="window.setInterval('tokei()',100)"> －－－－－－－－－－－－－－－－ というイメージでカウントダウンさせたいのですが、 何か方法はございますでしょうか？それともPHPを利用する時点で 不可能な話でしょうか？ (試しに後述のスクリプトを実践してみた所、案の定PHPで取得した秒で カウントダウンは止まってしまいます) それでは宜しくお願い致します。

  • アクセス時からのカウントダウンタイマー設置

    初回アクセスしたら3日後にカウントが終了するタイマーをつくりたいです。 2回目に訪問しても初回からのタイマーが表示されて 3日後には「受付は終了しました」と別ページに飛ばして表示させたいです。 初めての訪問者にはすべて3日後に終了するようにしたいので、 それぞれ、終了日が違います。 ・・・・というカウントダウンタイマーをJavaScriptで作りたいです。 よろしくお願い致します。

  • JavaScriptで毎日カウントダウン土日祝除く

    初めまして、よろしく御願いします。 JavaScriptで毎日カウントダウンをしたいと思っています。 条件１ 0時から10時までカウントダウンをする（月～金） 条件２　土日祝を除く（イレギュラー用に日付指定もできる） 条件３　時間：分：秒：ミリ秒の表示にしたい 以上の条件を満たしたものを作りたいと思っています。 検索をするとカウントダウンは出てくるのですが、 これといって適合するものはなく。。 悩んでいます。 お分かりになる方がいらっしゃいましたらご教示を御願いします。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する