カウントダウンJavascript(使い回し仕様)

カウントダウンを作っていて思うことがあった。
・日時が違うもの毎に1個1個作るというのが納得いかない。
・『年月日』指定するものもあれば、『時間』まで指定するものもある。
・『残り日数』以外にも『残り時間』を表示したい場合もある。
・24時間を切ったとき、残『0』日となるので、その場合は『残り時間』を表示したい。

そこで使い回し用を作ってみた。

※wordpressの記事内で使う場合、途中で空列を作らないこと!自動的に<p>~</p>が追加されちゃうから…

var CountDown = function(ymdHis,flag){
	today = new Date();
	target = new Date(ymdHis);
	diff = target.getTime() - today.getTime();
	days = Math.ceil( diff/(24*60*60*1000) );
	times = Math.ceil( diff/(60*60*1000) );
	if(days <= 1){ // last 1 days
		flag = "time";
		if(times < 0) // time up
			return false;
	}
	// 表示形式
	if(!flag)
		return days+"日";
	if(flag=="time")
		return times+"時間";
	else if(flag=="day_time")
		return days+"日("+times+"時間)";
	else if(flag=="day_and_time")
		return (days-1)+"日"+(times-((days-1)*24))+"時間";
	return days+"日";
};

変数に入れることも考えて、値を返すだけ。
期日を通り過ぎていたら『false』を返します。
すぐ表示させたい場合は『document.write()』のなかに指定する。

指定方法として
『ymdHis』は『YYYY/mm/dd HH:ii:ss』または『YYYY/mm/dd』
『flag』は、『time』残り時間、『day_time』残り日数(残り時間)
その他は全て『残り日数』という表示になる。
※残り0日または1日の場合、残り時間を表示する

flagを指定してもしなくてもどちらでもいいので、以下のような形になる。
というように表示される。

因みにコチラ、ajax仕様に非ず。
別にそこまで細かく出さなくてもいいかな、と思ったもんだから…。

コメント

タイトルとURLをコピーしました