HOME

初級者のための初級者による
HTMLタグ一覧 | FAQ FAQ | サイトマップ サイトマップ | お問い合わせ お問い合わせ
ホームページの作り方講座
ちょっと差のつくテクニックJavaScript で遊ぼう>指定した日までカウントダウンする
ホームページ作りの準備
1. ホームページとは?
2. ホームページの構造
3. ホームページ作りの手順
4. スペースの用意
5. ソフトウェアの用意
6. 素材の用意

ホームページの作り方
1. サンプルを作ってみよう
2. HTMLを編集しよう
3. データを転送しよう

ちょっと差のつくテクニック
1. ちょっと便利なHTML
2. JavaScript で遊ぼう
3. 掲示板で盛りあがろう
4. iモードのホームページ

要チェックな参考資料集
1. 参考ページリンク集
2. ホームページタブー20
3. 参考になる書籍集
4. その他お役立ちリンク集


ちょっと差のつくテクニック

JavaScript で遊ぼう

指定した日までカウントダウンする

指定した日まで自動的にカウントダウンします。カウントダウンをわざわざ記述しないでよいので便利です。

サンプル

設置方法

以下を <body> 内のファイルの指定した日までのカウントダウンを表示したい場所に貼りつけてください。「指定する年」、「指定する月」、「指定する日」それぞれは、カウントダウンの基準として指定なさりたい日付をそれぞれ記入してください。なお、上記のサンプルでは、それぞれ、「2001」、「1」、「1」と指定されています。(2001 年 1 月 1 日を基準とするようにしています。)
//前」 と記述している部分には、指定した日よりも前の時に表示するメッセージを、「//当日」と記述している部分には、指定した日当日に表示するメッセージを、「//後」と記述している部分には、指定した日よりも後の時に表示するメッセージを指定します。なお、メッセージの指定のし方は、「(」、「)」で囲まれた部分の内部で、カウントダウンの日数を「+ Now +」で指定し、前後にダブルクォーテーション「"」で囲んだ文字を並べることで行います。

<script language="javascript">
<!--
var Year = 指定する年;
var Month = 指定する月;
var Day = 指定する日;
var Date1 = new Date();
var Date2 = new Date(Year,Month-1,Day);
Now = (Date2.getTime() - Date1.getTime())/(24*60*60*1000);
Now = Math.ceil(Now);
if(Now > 0)
{ document.write("あと " + Now +" 日で 2001 年です。"); } //前
else if(Now == 0)
{ document.write("あけましておめでとうございます。"); } //当日
else if(Now < 0)
{ document.write("2001 年の元旦から " + -Now + " 日過ぎました。"); }//後
// -->
</script>

 

サンプルメーカー

下 (↓) のテキストボックス「指定日」にカウントダウンの基準として指定する日や「指定日前」、「指定日当日」、「指定日後」に表示するメッセージをいれて「サンプルを作成する」ボタンを押してください。
自動的に最指定した日までのカウントダウンするための HTML が生成されます。 「サンプル HTML」の内容をコピーしてお使いください。

指定日
指定日前 **日
例)「2001 年まで、あと、」**日「です。」
指定日
例)「2001 年元旦です。」
指定日後 **日
例)「2001 年元旦から、」**日「経ちました。」
 

サンプル
HTML

 

 

TOP ↑
・広告掲載・リンクのご要望はお問い合わせフォームよりお願いいたします。→お問い合わせフォーム
・ホームページ作りの基本編を、オフラインでも、印刷して手元でも読めるテキストブックにしました→テキストブックのダウンロード
©初級者のための初級者によるホームページの作り方講座 since 1997