■ 日付で背景を切り替える ■
ソースaは、<head> 〜 </head>間に記述して下さい。
■ サンプル ■
体感する為に「春夏秋冬」文字に日付(文字の横)をセットしてありますので、クリックして確認して下さい。

[04/10]      [07/10]      [10/10]      [12/10]
■ ソースa ■
<SCRIPT LANGUAGE="JavaScript">

// 月日で背景を変更する

dd = new Date();
mm = dd.getMonth() + 1;
dd = dd.getDate();
if (mm < 10) { mm = "0" + mm; }
if (dd < 10) { dd = "0" + dd; }
mmdd = "" + mm + "/" + dd ;

bgcss = new Array(
"01/01","02/29","huyu.css",
"03/01","05/31","haru.css",
"06/01","08/31","natu.css",
"09/01","11/30","aki.css",
"12/01","12/31","huyu.css");

for (i = 0; i < bgcss.length; i+=3) {
if(bgcss[i]<=mmdd && mmdd<=bgcss[i+1]) {
document.write('<LINK REL="stylesheet" HREF="' + bgcss[i+2] + '" TYPE="text/css">');
}
}
// -->
</SCRIPT>
<noscript><link rel="stylesheet" type="text/css" href="noscript.css"></noscript>
■ 外部CSS ■
BODY{
background-image: url("huyu.jpg");
}
■ 説  明 ■
日付で背景を切り替える小技です。実は日付でスタイルシートを切り替えるjavascriptです。

ソースaの"01/01","02/29","huyu.css",のように「開始日」「終了日」「スタイルシート名」の順に追加して下さい。
日付の記述方法は、月と日は必ず半角で2桁づつ および 月と日との間には必ず「/」を半角で記述して下さい。
日付は、1月1日から始まり12月31日で終わる連続した日付を設定してください。(ソースa参照)

サンプルは、四季の4つですが、イベントにあわせて追加は自由です。
例えば、2月14日のバレンタインデーなどを設定してみてください。

切り替え用のスタイルシートは外部CSSのように、すべて作成しておいてください。

<noscript>〜</noscript>は、javascriptがOFFになっている場合の対処するスタイルシートを記述しておく。

document.write( )のところを変えることで、例えば日付によってメッセージを変えるとか?出来ますよ。

背景素材:「ひまわりの小部屋」