アメーバブログに掲載された画像は、元画像が高精細であっても、記事上には圧縮して間引きされた画像が表示されます。 これは、アメーバシステムの通信上でやむを得ない処理です。 しかし「Ameblo Lightbox JS」は、アメーバの画像サーバーの元画像を呼び出して表示するので、非圧縮の高品位な画像を見る事ができます。
とりわけ画像に重きを置くPCユーザーにとって、このツールは価値があるでしょう。 ブログページ上の画像の価値に、このツールは何度も気付かせてくれます。
ver. 3.4以降 2024.02.18更新
「Ameblo Lightbox JS」の動作する範囲
ツールが動作する場所
このツールは、以下のページや画面上の画像を「Lightbox」に拡大表示できます。
◎ アメーバブログの各ユーザーの「ブログ」「アメンバー記事」のページ
◎ アメーバブログの各ユーザーの「画像一覧」ページ（詳細表示/リスト表示）
◎ アメーバニュースの各種ページ
◎ アメーバランキングページ
◎ ハッシュタグページ
「Lightbox」に表示できる画像と非対応の画像
▪ ページ上の全ての「img要素」を対象として「Lightbox」に拡大表示します。
▪「リンクカード」「Ameba Pick」のカバー画像、「Amebaスタンプ」「各種のバナー」「アメーバ絵文字」なども「Lightbox」に拡大表示できます。
▪「ブログヘッダー」「ブログ背景」の画像等は非対応です。（img要素ではない）
▪「リブログカード」のカバー画像、本文に埋め込まれた「ツイッター」「インスタグラム」の画像、ページ上のAD画像などは「iframe」内の表示で非対応です。
▪ クリック防止を施した画像などは「Lightbox」に表示できない場合があります。
各種設定の有効な範囲
「Ameblo Lightbox」の各種の設定はローカルストレージに保存して運用されます。 ユーザー自身のブログと他のユーザーのブログはドメインが同じなので、ブログ記事の設定は、全ユーザーのブログで共通になります。
ページ上の画像を「Lightbox」に表示する
ブログページ上の画像を「Lightbox」に表示する操作は、「Ctrl+」「Click」のモードにより異なります。 ブログページ以外での操作は、モードに関係なく同じです。
「Ctrl+」モード
「Ctrl+」モードは、画像に対する操作を「Ctrl+左Click」に統一した、基本的な操作モードです。 このモードは、ページ上のリンク操作が通常通りに行えます。
▪ ページ上の画像を「Ctrl+左Click」すると、その画像が「Lightbox」に拡大表示されます。（サイドバーやメッセージボード上の画像などを含む）
▪「画像一覧」（詳細表示/リスト表示）のサムネイル画像やランキングのサムネイル画像なども、「Ctrl+左Click」で「Lightbox」に表示されます。
「Click」モード
「Click」モードは、ブログ記事上の画像を「左Click」するだけで「Lightbox」に表示する事が出来ます。 ただし、この操作ができる範囲は限定されます。
▪ 対象になる画像は「ブログ記事の本文」に掲載された画像に限られます。
▪ サイドバー、メッセージボード、記事下のページャー部などは範囲外になります。
「Click」モードはブログ閲覧時の操作を簡単にしたモードで、他の機能は同じです。
モードの変更
「Lightbox」の上部にマウスポインターを移動すると、設定ボタンが表示されます。
● Ctrl+ または Click のボタンを押すと、モードが切り換わります。
▪ モード変更を行うと、直後にページがリロードされます。
▪ モード設定は全てのブログに対して有効で、次に変更するまで保持されます。
▪「Click」モードが選択可能な「ブログページ」「アメンバーページ」で表示した「Lightbox」でのみ、モードボタンが表示されます。
「Lightbox」の終了
画像を「Lightbox」に表示すると、拡大表示になります。
●「Lightbox」内を「左Click」すると、「Lightbox」が終了して元のページ表示に戻ります。
▪「画像一覧」の「精細表示」「リスト表示」の画面で「Lightbox」を表示していた場合は、元の「精細表示」または「リスト表示」の画面に戻ります。
▪「Lightbox」は別画面の様に見えますが、元のページを覆う枠に過ぎません。
「Graphic Zoom」と「Comic Zoom」
「Lightbox」に表示された画像を、更に拡大する事が可能です。 この拡大の仕様は「Graphic Zoom」（Gz）「Comic Zoom」（Cz）の2種を選択して利用できます。
2種の拡大仕様を実装した理由は、画像の縦横比によって拡大が過剰・不足する場合が生じるためです。 2種類の拡大率をユーザーの必要に合わせて設定する事で、拡大仕様を切り換えるだけで、満足な拡大結果が得られると思います。
下は拡大操作のダイアグラムです。
❶ ブログ画面で画像を「Ctrl+左Click」します。（「Clickモード」は「左Click」）
❷ 画像が「Lightbox」に表示されます。
❸ Lighbox内を「Ctrl+左Click」すると メインに設定した拡大仕様が適用されます。
❷～❸ のどの状態でも「左Click」で元のブログ画面の表示に戻ります。
メイン拡大仕様の切換と「Shift変更」
Lighbox内を「Ctrl+左Click」した時に適用されるのがメインの拡大仕様です。 これは「拡大率表示枠」を「左Click」すると切り換わります。
一方、 Lighbox内を「Shift+左Click」すると、メインの拡大仕様ではない方の拡大仕様が適用されます。（Shift変更機能）
●「Ctrl+左Click」➔ よく使うメイン拡大仕様を適用
●「Shift+左Click」➔ 使用頻度の少ないサブ拡大仕様を適用
「Graphic Zoom」「Comic Zoom」のどちらをメインとするかは、ユーザーの使用環境に合わせてください。
▪「Graphic Zoom」をサブ設定した場合は、「Lightbox内」を「Shift+左Click」した部分を中心に拡大表示となります。
「Graphic Zoom」の操作と特徴
●「Graphic Zoom」をメイン設定時は、Lightbox内の画像を「Ctrl+左Click」すると、クリックした部分を中心に「Gz」拡大表示をします。（ポイント拡大機能）
●「Gz」拡大表示をもう一度「Ctrl+左Click」すると、通常の「Lightbox」表示に戻ります。 ここから画像の別の部分を再び「Gz」拡大表示することができます。
▪「Lightbox」上部にマウスポインターを移動すると Gz 拡大率 と ＋ － の設定ボタンが表示されます。
● ＋ － のボタンを押すごとに「拡大率」が変更できます。
▪「Gz 拡大率」は「20%～400%」の範囲で設定できます。 設定は、ローカルストレージに保存され、「Gz」拡大表示の際に適用されます。
●「Gz」拡大表示の状態で Lightbox内を「左Click」すると「Lightbox」が終了して、元のページの表示に戻ります。
● Gz 拡大率 ボタンを「左Click」すると、拡大仕様が「Comic Zoom」に変わり、ボタンの表示が Cz 拡大率 になります。
「Comic Zoom 」の操作と特徴
「Lightbox」表示は、ウインドウに内接する最大サイズに画像を拡大表示します。 しかし、縦に長い4コマ漫画の様な画像の場合は拡大率が不足します。「Comic Zoom」は、この問題を改善した拡大仕様です。
●「Comic Zoom」をメイン設定時は、「Lightbox」内の画像を「Ctrl+左Click」すると「Cz」拡大表示になります。
▪「Lightbox」上部にマウスポインターを移動すると Cz 拡大率 と ＋ － の設定ボタンが表示されます。
● ＋ － のボタンを押すごとに「拡大率」が変更できます。
▪「Cz 拡大率」は「20%～90%」の範囲で設定できます。 設定は、ローカルストレージに保存され、「Cz」拡大表示の際に適用されます。
●「Cz」拡大表示の状態で Lightbox内を「左Click」すると「Lightbox」が終了して、元のページの表示に戻ります。
● Cz 拡大率 ボタンを「左Click」すると、拡大仕様が「Graphic Zoom」に変わり、ボタンの表示が Gz 拡大率 になります。
「背景色」の設定
「Lightbox」は「黒背景」「白背景」の選択が出来ます。「Lightbox」の上部にマウスポインターを移動すると 
のボタンが表示されます。
● ボタンを押すごとに、背景色の白/黒が変わります。
▪ 背景色の設定はローカルストレージに保持され、「Lightbox」表示は全ての場合に適用されます。
画像に設定されたリンクの扱い
「Ctrl+」モードは、「Ctrl」キーを押して「Lightbox」を起動させるので、画像を「左Click」すると設定されたリンクが機能します。 しかし「Click」モードでは、画像の「左Click」で「Lightbox」が起動するので、リンク機能が使えません。
▪「Click」モードでリンクを機能させたい場合は、「Shift+左Click」で別ウインドウにリンク先を表示させるか、「Ctrl+左Click」で他のタブにリンク先を表示させる操作が必要です。
リンクが扱い難くなる「Click」モードを考慮して、「Lightbox」内に便利なリンクボタンを表示します。 これは「Ctrl+」モードでも機能します。
「Lightbox」内のリンクボタン
「Lightbox」の上部にマウスポインターを移動すると、ボックスに表示した画像にリンクが設定されている場合は、左上端にリンクボタンが表示されます。
▪ リンクボタンは「画像一覧」の「詳細表示」「リスト表示」では表示されません。 これは、無用な操作の混乱を防ぐためです。
❶ 通常の方法で掲載された画像には、「画像一覧」へのリンクが設定されます。 この種の画像を「Lightbox」に表示した場合は、 Photo Storage のリンクボタンが表示されます。
●リンクボタンをクリックすると、ウインドウが「画像一覧」へ遷移します。
❷ 色々な理由で「画像一覧」へのリンクが失われた状態でユーザー画像が掲載されます。 その場合は Photo Storage Presumed ボタンを表示します。
▪ このボタンは推測したリンクで、常に「画像一覧」が開く確証はありません。
❸ 外部リンクが設定された画像を「Lightbox」表示した場合は Linked Page のリンクボタンが表示されます。
▪ これは「リンクカード」「ビックカード」「Amebaスタンプ」「各種のバナー」「ユーザーがHTML編集でリンク設定した画像」などを選択した場合です。
● このリンクボタンをクリックすると、ウインドウはリンク先に遷移します。
▪ 元のリンクが「別タブに表示」の設定でも、「遷移」の設定になります。
▪「Shift+左Click」「Ctrl+左Click」の操作で別タブの表示が可能です。
❹ 元の画像にリンクが設定されていない場合は、リンクボタンは表示されません。
リターン機能
●「画像一覧」（詳細表示）の「画像表示枠」内を「左Click」すると、この画面を開く前のブログページ、または「画像一覧」（リスト表示）に戻ります。
▪ これはブラウザの「 戻る」を押すのと同様の機能です。
「Ameblo Lightbox JS」を導入すると、ブログ掲載画像を「クリック」して、意図せず「画像一覧」を表示してしまう事が増えます。 その場合に、この機能を使うと簡単に元のページ表示に戻れます。
画像のドラッグ&ドロップ操作による取得
「Ameblo Lightbox」は、リンクが設定された画像を「Lightbox」表示するために、画像のクリック操作を抑止します。 そのため、ウインドウ外へ画像をドラッグしてコピーする操作が出来ませんが、「Lightbox」からこの操作が可能になります。
●「Lightbox」に表示された画像をデスクトップ等にドラッグアウトすると、送信時の圧縮を受けない高品位な画像を取得できます。
▪「Lightbox」内の拡大表示の状態でも同様にドラッグアウトが可能ですが、コピーで得られるサイズ・品質は全く同じです。
▪「Ameblo Lightbox JS」をOFFにしてページをリロードすると、通常のドラッグアウトによるコピーが可能になりますが、コピー画像は低品位になります。
〔注意〕
「ver.3.3」以前は、ドラッグコピーは「Print Screen」キーを押して「Copy Mode」にする必要がありました。 この操作は「ver.3.4」から不要になりました。
「ver.3.3」以前は「Print Screen」キーを押すと Copy Mode のプレートが表示されますが、「ver.3.4」以降は表示されません。
このツールの最新バージョンは、以下のリンクリストから探せます。
