画像表示に関して、今まではJugem提供の「Lightbox2」を使っていた。
それ自体特に問題があった訳ではないが、小さい画面だと写真がはみ出してしまう事が気になっていた。
我が家にある少し古いNetBookパソコンで見るとき、多少見難かった。
自分のWebサイトでは、「Lightbox2」ではなく「Lightbox_plus」を使っており、こちらの方は、画像の自動縮小を行ってくれる優れもの。
という訳で、「Lightbox_plus」に入れ替えて見た。結論から言うと、今のところ問題なく動作している。
ただ、ポイントと言うか気になっている点は、Jugem提供でない以上、ライブラリをJugem側に設置できないこと。
要は「Lightbox_plus」を使うたびにインターネットを経由し、他社のサーバーにアクセスする必要がある。
しばらくは様子を見ることにするが、現状でもGoogleマップを貼り付けており、ブログの画面を出すたびに他社のサーバーにアクセスすること自体は大差ないのも事実。
【お詫び】
上記設定後、セキュリティを確保するための作業を行い、その際断続的に画像が正常に表示されない事がありました。
現在は、正常に表示されているはずです。
大きめの写真、サイズは1280×720
【設定方法】
<HEAD></HEAD>の間に、下記の2行を追加する。
それ以外は、Jugem標準の「lightbox2」と同じ。Jugem指定の部分は不要です。
<link rel="stylesheet" type="text/css" href="http://aaa.bbb.com/lightbox/resource/lightbox.css" media="screen,tv">
<script type="text/javascript" charset="UTF-8" src="http://aaa.bbb.com/lightbox/resource/lightbox_plus.js"></script>
*1 srcの部分は、各自の環境に合わせて変更する。
*2 lightbox_plus.jsの最後の部分に、lightbox_plus用の画像(loadingやボタン)を指定する部分があるので、そこは絶対パスへ変更する。
【手順の確認】
1. Jugem標準のLightbox2を設置し、正常に動作することを確認。
2. 何処かのレンタル・サーバーに、lightbox_plusのライブラリをインストール。
3. 必要に応じ、lightbox_plusアクセスのセキュリティを設定。
4. Jugem標準の設定で、<HEAD></HEAD>の間に追加した部分を、上記2行に変更する。
今回は、この4つの手順で変更実施。