本日  昨日
 
03/16(Sun) 02:54

o カウントダウン表示
★「おしらせ」★
指定日を過ぎると経過時間を表示するカウントアップ機能を追加しました(2001/12/03)

指定日(2005年1月1日や誕生日など)までのカウントダウンをステータス行またはフォーム内にリアルタイムに表示するスクリプトです。
ステータス行と下のフォームにカウントダウン表示例を示します。あなたのニーズに合わせて使い分けてください。
設置方法

1.下のスクリプトをコピーし、<HEAD>と</HEAD>のなかに貼りつけます。

2.<BODY>タグのなかに、<BODY bgcolor="white" onLoad="countdown()"> と記述します。

3.スクリプトの不要な方をコメント行(文頭に//をつける)にするか削除します。

  • ステータス行表示の場合
    status=title+header+timer+footer";
  • フォーム内表示の場合
    document.timeFM.count.value=title+header+timer+footer";
を使います(スクリプトには両方の命令が記述されてます)。もちろん両方使ってもかまいません。

(注) 1日=24時間×60分×60秒 = 86400秒

4.フォーム表示の場合は下の表示用フォームを表示したい場所に記述します。(ステータス行表示の場合はこの記述は必要ありません。)

スクリプト
指定日とそのタイトルを変更します。(現在は2002年1月1日の値が設定されてます)

  1. var stadown = Date.UTC(2001,11,31,15,0,0);に指定日を年(1900〜),月(0〜11),日(1〜31),時(0〜23),分(0〜59),秒(0〜59)の順にグリニッジ標準時(日本時間−9時間です)で指定します。月は「月−1」(12月なら11)の値ですので注意して下さい。
  2. var title = "2002年1月1日";を指定日のタイトルに変更します。
<script language="JavaScript"> <!-- //カウントダウン by 「菊池さん」<http://kikuchisan.net/> var stadown = Date.UTC(2004,11,31,15,0,0); var title = "2005年1月1日"; function countdown() { var now = new Date(); var cntdown = Math.floor((stadown-now.getTime())/1000); if (cntdown > 0) { header = "まであと"; footer = "です"; } else { cntdown = -cntdown; header = "から"; footer = "経過"; } timer = Math.floor(cntdown/86400)+"日"+(Math.floor(cntdown/3600))%24 +"時間"+(Math.floor(cntdown/60))%60+"分"+cntdown%60+"秒"; //ステータス行表示 status=title+header+timer+footer; //フォーム表示 document.timeFM.count.value=title+header+timer+footer; setTimeout("countdown()",1000); } // --> </script>

表示用フォーム
「timeFM」と「count」はスクリプトの「document.timeFM.count.value=・・・・」の名前と対応してますので、フォーム名やINPUT名を変更したい時は同じ名前にして下さい。フォームのサイズはsize=52の値を変更することで調整できます。
スクリプトのスタートはBODYタグにonLoad="countdown()"を書きます。
<BODY onLoad="countdown()"> ・ ・ <form name="timeFM"><input size=52 name="count"></form>


 
 
©1997- Kikuchisan's workshop All rights reserved //

スポンサーリンク

関連コンテンツ