画像をクリックで拡大する設定方法

Question

こんにちは　治療院のＨＰとアメーバーブログを自作しています。

お客さまアンケートの画像を挿入して、クリックしていただくと

拡大するような設定にしたいのですが、

やり方をおしえていただけないでしょうか？

よろしくおねがいします。)^o^(

Kaneyan-R · Accepted Answer

綴り間違えてましたm(_ _)m

×　<a herf=
○　<a href=

訂正ついでにタグの解説ですが、前者は縮小表示用の小さいサイズの画像を準備しておいて、クリックすると元の画像が別ウインドウ（またはタブ）で表示されるパターン。
後者は元々の画像をwidth（幅）とHeight（高さ）の値に縮小表示させて、それをクリックすると縮小無しで表示させるパターン。表示のされ方はどちらも同じです。

前者と後者どっちが良いかは正直どっちでも良いんですが、メリットとデメリットは次のようになります。

【前者の場合】

メリット
・画像サイズを小さく出来るので、ページの読み込み時間が速くなる。
・別の画像を使える（ボタンやバナー等）。

デメリット
・縮小用画像を別に作る必要がある。
・元の画像を表示させる場合時間がかかる。

【後者の場合】

メリット
・縮小画像を作る必要がない。
・縮小画像と元の画像は同じものなので、元の画像を表示する場合、ブラウザのキャッシュが利用されすぐに表示される。

デメリット
・縮小画像と元の画像は同じものなので、ページの読み込みに時間がかかる。
・別の画像を使えない（ボタンやバナー等）。

と言うわけで、「ページを表示するのを早くしたい」なら前者、「拡大画像をすぐに表示したいなら」後者が良い事になります。

Kaneyan-R · Answer

アメーバブログがどうなっているかなど知りませんので、質問者様が示された動作になるHTMLを掲示しただけです。＞(1)まず、ＪＰＧのところに＊＊＊＊.JPGと表示されるような文字列の表示つくれないです。汗＞ＰＣのペイントやフォトスコープで加工するとＪＰＧでの保存となりますが、画像が実際保存される感じで＞＊＊＊＊.JPGのような表示にならないので、ここに入れることができない状態です。何が問題なのか分かりません。 JPEGだろうが、GIFだろうが、PNGだろうが、ブラウザで表示できる画像ならなんでも良いんですけど？「ここに入れる」とはどこ（何）のこと？＞(2)ＪＰＧの表示にするのに、アメブロのＣＳＳ編集のところからなんとか＊＊＊＊.JPGの表示にできました。（ここに保存できる容量がかぎられているので、この方法は仮にしか使っていません。）意味不明。CSSなんて関係ありません。＞この＊＊＊.jpgの表示を下に表示していただいたものの＋＋＋.jpgのところに入れてみましたが、＞（アメブロのＨＬＭタグ表示のところにです。）＞< img src="img.jpg" width="横のサイズ" height="縦のサイズ"> < /a> のものを以下の通りいれました。