自動更新されるカレンダー：javascript
シェア
ツイート
最終更新日：
自動で更新されて翌月分まで表示される
javascriptのカレンダーを作ってみたので
使い方をメモ。
calender.jsの使い方
まず、calender.jsを
コピーするなどしてcalender.jsとして保存します。
次に保存したcalender.jsを読み込むためにhead内に
<script type="text/javascript" src="calender.js"></script>
と記述し準備完了！
あとはカレンダーを表示したい箇所に
<div class="cal"> <!--今月のカレンダー--> <script type="text/javascript"> setCalender(); </script> </div> <div class="cal2"> <!--翌月のカレンダー--> <script type="text/javascript"> setCalender2(); </script>
と記述すればＯＫ。
calender.jsのカスタマイズ
calender.js内の
// 祝日3：独自の祝日設定 var Holidays3 = new Array(8,12, 8,13, 8,14, 8,15, 月,日);
(月,日, 月,日)と｢例｣(8,12, 8,13)記述すれば
その日を祝日にできます。
また、土日・祝日を営業日にしたい場合は
// 営業日：休日で営業する日の設定 var Workdays1 = new Array(月,日);
の部分を同じように何月何日かを指定すればＯＫです。
デザイン等を変更したい場合はCSSでテキトーにいじればＯＫ
calender.jsの注意点
今月のカレンダーだけを表示する場合は問題ありませんが
翌月のカレンダーを表示する際は、
毎月１日等に
calender.jsの翌月カレンダー部分の
//最初の曜日 0 1 2 3 4 5 6 var startDay = 0;
というところを指定しないと表示がおかしくなってしまいます。
上記の指定は翌月カレンダーの1日を何曜日からはじめるか
という部分で、
- 0：日曜日
- 1：月曜日
- 2：火曜日
- 3：水曜日
- 4：木曜日
- 5：金曜日
- 6：土曜日
のように例えば1日が火曜日から始まるのであれば
//最初の曜日 0 1 2 3 4 5 6 var startDay = 2;
のように指定しないといけません。
なので完全に自動更新されるカレンダーというわけではないです・・・
JavaScriptのおすすめ参考書
ポチップ
ポチップ
