サムネイル画像をクリックすると拡大画像を表示させる方法

質問

今はまずサーバに同一画像の小さい写真（サムネイル用）と大きい写真の両方をアップロードして、
小さい画像を表示させて、そこにリンクをつけて大きい画像のURLへとばすようにタグを書いているのですが、これでは同じ写真を２枚アップロードしなくてはいけず、面倒です。

1枚の写真だけをアップロードしてサムネイル画像を表示させて、クリックしたら拡大写真がでるようにするためにはどのようなタグを使えばいいのでしょうか？

回答No.2

noname#48234 · ベストアンサー

サムネイル表示するときだけ画像表示のサイズ指定をしてやればよいですね。

<a href="aaa.jpg"><img src="aaa.jpg" width="ピクセル数または％" height="ピクセル数または％"></a>

ただし、お分かりのように基の大きな画像を読み込んで表示だけ小さくする訳ですから、通信回線が遅かったり画像数が多いとサムネイル用の画像を用意したときよりも表示が遅くなります。

お礼

やはりサーバーが重くなるのですね。
その辺も少し考えないといけないですね・・・
ありがとうございました。
とりあえず試してみます

回答No.1

pi8027

img要素のwidth属性とheight属性で大きさを指定すれば、画像を共有出来る。
但し、サーバーが重くなるので止めた方が良い。

お礼

サーバーが重くなるのですか・・・
多数の画像をアップロードする場合は２枚用意するようにします。
ありがとうございます