指定した時間が過ぎたらブラウザをリフレッシュしなくても画像が変わる

※00:00 - 12:00は「午前」の画像が、12:00 - 00:00は「午後」の画像が、ブラウザをリフレッシュしなくてもチェンジする。
※今のところただ闇雲に画像がチェンジするだけw 


<div>
	<img id="target" src="images/am.png" alt="">
</div>


	(function() {
		var schedule = "12:00"; // ←指定時刻
		var target = "target" // ←対象の画像要素のid
		var targetSrc = "images/pm.png"; // ←取替え後の画像アドレス
		var interval = 10 * 1000; // ←確認する時間のピッチ(10秒)
	
		var now = new Date();
		schedule = schedule.split(":");
			var h = +schedule[0] || 0;
			var m = +schedule[1] || 0;
			var s = +schedule[2] || 0;
		now.setHours(h), now.setMinutes(m), now.setSeconds(s); 
			(function R(){
				if ((new Date()) - now > 0) {
					document.getElementById("target").src = targetSrc;
				} else {
					setTimeout(R, interval);
				}
			})();
	})();

TOP