***** 静止画像のポップアップ表示について 2020/04/03 *****
2020年1月末に発生した忍者ブログサーバー障害の復旧後から画像ファイルの拡張子が無くなっているため、暫定措置としてfunction ImageFileCheck(targetExt)での画像ファイル判別を省いた。
このため、バナークリックでリンク先へジャンプする事が不可能になるので、ブログ記事内の画像から画像以外へジャンプする記事を書く事は避けなければならない。

***** YouTube動画の埋め込みコードについて 2016/04/12 *****
当初からの事であるが、ブラウザによって右クリックで取得する埋め込みコードの違いで問題が発生する。

FirefoxとChromeの右クリックから埋め込みコードを取得すると
iframe width="854" height="480" src="https://www.youtube.com/embed/ここに動画の固有の記号がある" frameborder="0" allowfullscreen="">

Ieの右クリックで取得すると
iframe width="640" height="360" src="https://www.youtube.com/embed/ここに動画の固有の記号がある?feature=player_detailpage" frameborder="0" allowfullscreen="">

違いは動画の固有記号の後に？でパラメータを書くか、書かないかの違いである。
現時点まで、？でパラメータを書かないと、このブログには正しくアップ出来ない。

***** 静止画像のポップアップ表示について 2016/02/02 *****

静止画像ポップアップを閉じるボタン以外にも、ポップアップのダブルクリックで閉じるようにした。
左上端の閉じるボタンを目がけてマウスを動かすのが面倒なので、ダブルクリックでも閉じられるようにした。
なかなか使い勝手が良くて、満足している。

***** スライドショー表示について 2016/01/27 *****

スライドショー表示プログラムの表示に関する部分を変更した。
これまではimgのsrcを入れ替えていたが、今回は配列に格納した画像を順次表示する事にした。

***** スライドショー表示について 2016/01/16 *****

1/9 にスライドショープログラムの実装が完了した。
この時点でjQueryを使うプログラムが無くなったので、jQueryの利用をやめた。
スライドショーに使う画像は、html にimgタグで順に記述する。
画像切り替え速度はCSSのTransition設定で行う。

***** 静止画像のポップアップ表示について 2016/01/16 *****

1/6 に静止画像のリンク先画像をポップアップ表示するプログラムを実装した。
その後、1/16までにポップアップを徐々に拡大する変更を加えた。
ポップアップはマウスで移動する事が可能で、またモーダルではないので背面の操作も出来る。
なお、動画のポップアップもすでに実装済みである。
動画ポップアップはマウス移動は不可であるが、静止画像ポップアップと同様に背面操作が可能。

***** Pageのタイトル長について 2015/08/28 *****

ブログ上部のナビゲーションボタンに表示されるテキストは、テキスト長が長いと表示が崩れる。
Pageの編集でタイトルを修正する際には、タイトルのテキスト長に注意すること。
IEでは崩れない場合でもFirefoxで崩れるので、確認が必須となる。

***** YouTube動画の貼り付けについて 2014/12/17 *****

このブログには、記事にYouTube動画の貼り付けコードをコピペするだけで、自動的にサムネイル表示をする機能がある。
更に、埋め込みコードに、背景色、余白、サイズのパラメーターを追加すると、設定値に従った背景色、表示位置、サイズで動画の配置が出来る。

背景はbackground-colorで設定する。色名での設定が可能である。
余白はmarginで設定する。px、em等の単位を付けて半角スペース区切り４箇所分のショートハンドで設定する。
サイズはresizeはで設定する。動画を配置する親要素に対する％値である。
ーーーーーーーーーーーーーーーーー

次の動画サンプルは、background-color="pink" margin="0 0 0 3em" resize="35" を設定した。



詳細情報：

2014/12/17 現在
 
YouTube埋め込みコードの取得と利用方法　－－－－－－－

＊ YouTubeの動画を右クリックして埋め込みコードを取得。
＊ 埋め込みコードを、ブログ投稿フォームのソースコードのタブを開いて記述する。

YouTube埋め込みコードに変更を加えない場合は、次のとおりの処理が自動的に行われる。

・動画の静止画像サムネイルを表示して、動画リンクを設定する。
・サムネイル画像及び動画サイズを、動画を配置した要素の幅を基準に既定幅で設定する。
・現時点での動画の既定幅は、動画を配置した要素幅の75％とする。
  
基本の表示　－－－－－－－－－－－－－－－－－－－－－

YouTube埋め込みコードに変更を加えない場合は、テンプレートよる自動再設定が行われる。
テンプレートによる自動再設定の詳細は、次のとおり。

・動画サイズ： 動画を配置した画面幅の75％で、縦横比を維持して表示
・背景色： #1c1c1c
・表示位置余白： margin 0
・表示順位： wmode=transparent を設定して背面にする
・関連動画の表示： rel=0 再生終了時に関連動画の表示をしない
 
表示設定の変更　－－－－－－－－－－－－－－－－－－－

表示設定の変更は、YouTube埋め込みコードに対して次の変更を行う。

・ テンプレートによる自動再設定を無効化：　iframe属性に、class="noresize" を追加

・ 動画サイズ： iframe属性に、resize="＊" を動画を配置した画面幅の％値で追加
・ 背景色： ifarame属性に、background-color="色名" を追加
・ 表示位置余白： iframe属性に、margin="＊ ＊ ＊ ＊"  をショートハンド書式で追加

・ 表示順位： 変更不可
・ 関連動画の表示： 変更不可