カレンダー Calendar

祝日の表記等はありませんのでご注意ください。

PHP版のカレンダー(月切替機能なし)はこちら
jQuery版のカレンダー(月切替機能付)はこちらです。

サンプル

 

ライブラリのダウンロードと設置

こちらをクリックしてダウンロードしてください。
ダウンロードしたcalendar.jsを任意の場所へ置き読み込みます。

オブジェクトの生成と表示

Calendarオブジェクトを生成します。
引数には表示する要素とオプションを設定でき、第一引数(表示する要素)は必須で、第二引数(オプション)は省略できます。

引数 初期値 説明
第一引数 null カレンダーを表示する要素
第二引数   オプション
詳細はこちら

【JavaScript】

【HTML】

メソッド

以下のメソッドが実行可能です。

メソッド 説明
next() 次の月に切り替え
prev() 前の月に切り替え
view() カレンダーの表示

【JavaScript】

【HTML】

オプション

以下の設定が可能です。

設定 初期値 説明
viewElement null 表示する要素
year 現在の年 初期表示するカレンダーの年
month 現在の月 初期表示するカレンダーの月
headerVisible true 現在の年月と月移動ボタンの表示・非表示
controllerVisible true 月移動ボタンの表示・非表示
tableClass calendar カレンダー本体のCSS Class名
prevClass prev 前の月移動ボタンのCSS Class名
nextClass next 次の月移動ボタンのCSS Class名
sunClass sun 日曜日のCSS Class名
satClass sat 土曜日のCSS Class名
todayClass today 現在の日付のCSS Class名
emptyBlockClass empty 空白セルのCSS Class名
prevText << 前の月移動ボタンの文字列
nextText >> 次の月移動ボタンの文字列
emptyBlock   空白セルの文字列
weekFormat ['日', '月', '火',
 '水', '木', '金', '土']
曜日の文字列
titleFormat Y年m月 年月表示用の書式

JavaScript逆引きリファレンス一覧へ戻る