PROGRAMMING
javascript
- ページャーを作る(簡易版)
- ページャーを作る 4/4
(クロスブラウザ対策)
(ページャー表示用メソッド)
(ページャーの使い方) - ページャーを作る 3/4
(イベント登録) - ページャーを作る 2/4
(スタイルの設定) - ページャーを作る 1/4
(ページャー用関数を準備)
(各要素を生成) - 自作カレンダーを作る 6/6
(11.~14.各種メソッド)
(15.簡単な使い方) - 自作カレンダーを作る 5/6
(09.祝休日の判定)
(10.閏年の判定) - 自作カレンダーを作る 4/6
(08.イベントの設定) - 自作カレンダーを作る 3/6
(07.スタイルの設定) - 自作カレンダーを作る 2/6
(05.カレンダーのマスのみ作成)
(06.各マスへ年月・日付を埋め込み) - 自作カレンダーを作る 1/6
(01.カレンダーの基を準備)
(02.各月の日数や年月日の区切り文字)
(03.前月・次月指定時の処理)
(04.前月・次月部分の年月を算出) - JS-Image-Resizerを使って画像を高画質で縮小
- ファイルを作成しローカルに保存
- モーダルウィンドウをクラス化
- ストップウォッチを作る
- XMLHttpRequest Lebel2を試してみる
- jQuery:Tableで親・子・兄弟要素を取得
- 文字列をセパレータ文字で分割し配列で返す関数
- forループのカウンタを使用している関数の定義
- クロージャの使いどころ
- JSONPでクロスドメイン
- AjaxでJSON形式のデータを扱う
- jsファイルからjsファイルを呼び出す
- jQuery:モーダルウィンドウを作ってみる
CSS
- フォルダ構成をCSSで見やすくする
- シンタックスハイライトPrismのカスタマイズ
- リスト(li)を中央に配置する
- ブロックレベル要素全体をリンクにする
- 実践と点線の交わり部分のギザギザをすっきりさせる
PHP
Java
- IntelliJ.Gradle.JavaFX(6) プラグイン org.beryx.jlink を使ってみる
- IntelliJ.Gradle.JavaFX(5) NSISでインストーラーを作る
- IntelliJ.Gradle.JavaFX(4) exewrapで実行可能jarをexe化する
- IntelliJ.Gradle.JavaFX(3) Jlink でカスタム JRE を作る
- IntelliJ.Gradle.JavaFX(2) すべての依存対象を含んだ Fatjar を作る
- IntelliJ.Gradle.JavaFX(1) アプリケーションを作る
- javaのコンパイルと実行
- イメージを回転する
- Exif情報を簡単に取得できるライブラリ
- 高画質で画像縮小
- JDBCによるデータベース操作
自作カレンダーを作る 5/6
自作カレンダーを作るの5ページです。
MkenCalendarのダウンロード(mkenCalendar.js + mkenCalendar-min.js)
mkenCalendar.zip
自作カレンダーを作る 1/6
01. まずはカレンダーの基を準備
02. 各月の日数や年月日の区切り文字
03. 前月・次月指定時の処理
04. カレンダーの前月・次月部分の日付の年月を算出
自作カレンダーを作る 2/6
05. カレンダーのマスのみ作成
06. 各マスへ年月・日付を埋め込み
自作カレンダーを作る 3/6
07. スタイルの設定
自作カレンダーを作る 4/6
08. イベントの設定
自作カレンダーを作る 5/6
09. 祝休日の判定
10. 閏年の判定
自作カレンダーを作る 6/6
11. 選択されている日付を得るメソッド
12. スプリッタを変更するためのメソッド
13. カレンダーを表示するメソッド
14. 指定した日付にジャンプするメソッド
15. 簡単な使い方
9.プロパティやメソッドの追加(祝休日の判定)
祝休日のメソッドは以下のとおりで、戻り値として配列のインデックスを返すようにしました。
祝休日でない場合の戻り値は-1となります。
MkenCalendar.prototype.holiday = function(toshi, tsuki, hi){
var syukujitsu = [];
var syuku_cnt = 0;
var nichi;
var syukuDay;
/* 国民の祝日(決められた日 16日あり) */
// 元日(1月1日)
syukujitsu[0] = toshi + this.spliter + "1" + this.spliter + "1";
// 成人の日(1月の2月曜日)
nichi = this.howDay(toshi, 1, 2, 1);
syukujitsu[1] = toshi + this.spliter + "1" + this.spliter + nichi;
// 建国記念日(2月11日)
syukujitsu[2] = toshi + this.spliter + "2" + this.spliter + "11";
// 新天皇誕生日(2月23日) ************************************
if(toshi >= 2020) {
syukujitsu[3] = toshi + this.spliter + "2" + this.spliter + "23";
}
// 春分の日(前年の2月1日官報に掲載)・簡易計算法
var haru =
Math.floor(20.8431+0.242194*(toshi-1980)-Math.floor((toshi-1980)/4));
syukujitsu[4] = toshi + this.spliter + "3" + this.spliter + haru;
// 昭和の日(4月29日)
syukujitsu[5] = toshi + this.spliter + "4" + this.spliter + "29";
// 憲法記念日(5月3日)
syukujitsu[6] = toshi + this.spliter + "5" + this.spliter + "3";
// みどりの日(5月4日)
syukujitsu[7] = toshi + this.spliter + "5" + this.spliter + "4";
// こどもの日(5月5日)
syukujitsu[8] = toshi + this.spliter + "5" + this.spliter + "5";
// 海の日(7月第3月曜日)
nichi = this.howDay(toshi, 7, 3, 1);
syukujitsu[9] = toshi + this.spliter + "7" + this.spliter + nichi;
// 山の日(8月11日)
syukujitsu[10] = toshi + this.spliter + "8" + this.spliter + "11";
// 敬老の日(9月第3月曜日)
nichi = this.howDay(toshi, 9, 3, 1);
syukujitsu[11] = toshi + this.spliter + "9" + this.spliter + nichi;
// 秋分の日(前年の2月1日官報に掲載)・簡易計算法
var aki =
Math.floor(23.2488+0.242194*(toshi-1980)-Math.floor((toshi-1980)/4));
syukujitsu[12] = toshi + this.spliter + "9" + this.spliter + aki;
// 体育の日(10月第2月曜日)
nichi = this.howDay(toshi, 10, 2, 1);
syukujitsu[13] = toshi + this.spliter + "10" + this.spliter + nichi;
// 文化の日(11月3日)
syukujitsu[14] = toshi + this.spliter + "11" + this.spliter + "3";
// 勤労感謝の日(11月23日)
syukujitsu[15] = toshi + this.spliter + "11" + this.spliter + "23";
// 平成天皇誕生日(12月23日) *************************************
if(toshi <= 2018) {
syukujitsu[16] = toshi + this.spliter + "12" + this.spliter + "23";
}
/* 振替休日(祝日が日曜日の場合の月曜日) */
// 元日(1月1日)
syukuDay = new Date(toshi, 0, 1);
if (syukuDay.getDay() === 0) {
syukujitsu[17] = toshi + this.spliter + "1" + this.spliter + "2";
}
// 建国記念日(2月11日)
syukuDay = new Date(toshi, 1, 11);
if (syukuDay.getDay() === 0) {
syukujitsu[18] = toshi + this.spliter + "2" + this.spliter + "12";
}
// 新天皇誕生日(2月23日)
if(toshi >= 2020) {
syukuDay = new Date(toshi, 1, 23);
if (syukuDay.getDay() === 0) {
syukujitsu[19] = toshi + this.spliter + "2" + this.spliter + "24";
}
}
// 春分の日
syukuDay = new Date(toshi, 2, haru);
if (syukuDay.getDay() === 0) {
var haruDay = parseInt(haru) + 1;
syukujitsu[20] = toshi + this.spliter + "3" + this.spliter + haruDay;
}
// 昭和の日(4月29日)
syukuDay = new Date(toshi, 3, 29);
if (syukuDay.getDay() === 0) {
syukujitsu[21] = toshi + this.spliter + "4" + this.spliter + "30";
}
// 憲法記念日(5月3日)
syukuDay = new Date(toshi, 4, 3);
if (syukuDay.getDay() === 0) {
syukujitsu[22] = toshi + this.spliter + "5" + this.spliter + "6";
}
// みどりの日(5月4日)
syukuDay = new Date(toshi, 4, 4);
if (syukuDay.getDay() === 0) {
syukujitsu[23] = toshi + this.spliter + "5" + this.spliter + "6";
}
// こどもの日(5月5日)
syukuDay = new Date(toshi, 4, 5);
if (syukuDay.getDay() === 0) {
syukujitsu[24] = toshi + this.spliter + "5" + this.spliter + "6";
}
// 山の日(8月11日)
syukuDay = new Date(toshi, 7, 11);
if (syukuDay.getDay() === 0) {
syukujitsu[25] = toshi + this.spliter + "8" + this.spliter + "12";
}
// 秋分の日
syukuDay = new Date(toshi, 8, aki);
if (syukuDay.getDay() === 0) {
var akiDay = parseInt(aki) + 1;
syukujitsu[26] = toshi + this.spliter + "9" + this.spliter + akiDay;
}
// 文化の日(11月3日)
syukuDay = new Date(toshi, 10, 3);
if (syukuDay.getDay() === 0) {
syukujitsu[27] = toshi + this.spliter + "11" + this.spliter + "4";
}
// 勤労感謝の日(11月23日)
syukuDay = new Date(toshi, 10, 23);
if (syukuDay.getDay() === 0) {
syukujitsu[28] = toshi + this.spliter + "11" + this.spliter + "24";
}
// 平成天皇誕生日(12月23日)
if(toshi <= 2018) {
syukuDay = new Date(toshi, 11, 23);
if (syukuDay.getDay() === 0) {
syukujitsu[29] = toshi + this.spliter + "12" + this.spliter + "24";
}
}
/* その前後が祝日の場合の休日(祝日にはさまれた平日) */
var keiro = parseInt(syukujitsu[12].substr(7, 2)); // 敬老の日
var syubun = parseInt(syukujitsu[15].substr(7, 2)); // 秋分の日
if (syubun - keiro === 2) {
keiro++;
syukujitsu[30] = toshi + this.spliter + "9" + this.spliter + keiro;
}
/* オリンピックの特例 *************************/
if(toshi === 2020) {
// 海の日
syukujitsu[9] = toshi + this.spliter + "7" + this.spliter + "23";
// スポーツ(体育)の日
syukujitsu[13] = toshi + this.spliter + "7" + this.spliter + "24";
// 山の日
syukujitsu[10] = toshi + this.spliter + "8" + this.spliter + "10";
}
/* 皇太子即位の特例 *************************/
syukujitsu[31] = "2019" + this.spliter + "4" + this.spliter + "30";
syukujitsu[32] = "2019" + this.spliter + "5" + this.spliter + "1";
syukujitsu[33] = "2019" + this.spliter + "5" + this.spliter + "2";
syukujitsu[34] = "2019" + this.spliter + "10" + this.spliter + "22";
// 指定の日が祝日(or休日)かを判定
for (var j = 0; j <= 30; j++) {
syuku_cnt =
syukujitsu.indexOf(toshi + this.spliter + tsuki + this.spliter + hi);
}
// 祝日の配列インデックスを返す -1は祝日でない
return syuku_cnt;
};
また、祝休日には第n番目の曜日となる場合もあるので、「第n番目の曜日の日付を求める」メソッドも追加しました。
MkenCalendar.prototype.howDay = function(year, month, n, WantDayWeek) {
var nichi;
var FirstDay = new Date(year, month-1, 1);
var FirstDayWeek = FirstDay.getDay(); // 1日の曜日
if ((WantDayWeek - FirstDayWeek) >= 0) {
// 求めたい日付(0かプラスの場合)
nichi = 1 + (WantDayWeek - FirstDayWeek) + 7 * (n - 1);
}
if ((WantDayWeek - FirstDayWeek) < 0) {
// 求めたい日付(マイナスの場合)
nichi = 1 + (WantDayWeek - FirstDayWeek) + (7 * n);
}
return nichi;
};
10.プロパティやメソッドの追加(閏年の判定)
上の項で使用された閏年を得るメソッドは次のとおり。
MkenCalendar.prototype.isLeapYear = function(year) {
if(((year % 4 === 0) && (year % 100 !== 0)) || (year % 400 === 0)) {
return true;
} else {
return false;
}
};