2月20日 サムネイルからおおきな画像を表示

大きな画像(400×300)をアップロードして、サムネイル表示させ、そのサムネイル画像にリンクを貼り、原寸大(400×300)で表示させる方法。
c0044777_23592440.jpg
             アップロードサイズ400×300
これを小さいサイズで表示するには ヘルプの 「< img > タグの使用」 に説明があるように
< img src=ファイルURL  width=X height=Y > を使います。

ファイルURL” は 「参照」から画像アップロードをして 
        「プレビュー画面」で、画像を右クリック→プロパティーを選択
アドレスURL  (原寸サイズ400×300)
http://pds1.exblog.jp/pds/1/200502/19/77/c00*****_23422***.jpg

をコピーします。

画像アップロードした時のもとのタグ
[ #IMAGE|c00*****_23422***..jpg|200502/20/77/|left|400|300#]


< img src=ファイルURL> タグで上書きします(書き換えます)。
< img src=
http://pds1.exblog.jp/pds/1/200502/19/77/c00*****_23422***.jpg >


この画像の “表示サイズを指定” してサムネイル表示します。

サムネイルサイズは私のページでは
2枚横に並べる時は  width=200 height=150 (画像・左)
くっついてしまう時は  width=195 height=146 
で、スペースを間に入れます。(画像・中央にするとくっつきます)
 

3枚横に並べる時は width=120 height=90
  
ぐらいが丁度いいみたいです。

つまりこうなります。
< img src=
http://pds1.exblog.jp/pds/1/200502/19/77/c00*****_23422***.jpg width=120 height=90 >


さて、これに大きい画像のリンクを張るのですが
先の画像タグ
< img src=
http://pds1.exblog.jp/pds/1/200502/19/77/c00*****_23422***.jpg width=120 height=90 >

を範囲指定し、
“内容” にある “リンク” をクリック
c0044777_171359.jpg
スクリプトプロントにリンク先URLを入力
アドレスURL
「 http://pds1.exblog.jp/pds/1/200502/19/77/c00*****_23422***.jp 」
をコピペ
c0044777_1285092.jpg
「OK」をクリックし、
「送信」します。

画像にリンクが張られます。

※ プレビュー画面では、“リンク画面”は 表示されないので
   「送信」 して確認してください。
※ 画像サイズは400×400以上に大きくしないよう注意があります。
   画像が乱れるそうです。
※ 上記のタグには文字表示するために、“<”の次にスペースが入って
   います。 コピペで使うときはスペースを削除してください。
   “< ”→“<”。
   またはヘルプにある“< img src=>”をコピペしてください。
[PR]
by elfin05 | 2005-02-20 00:32 | 画像表示・ソフト
<< 2月21日 画像サイズの変更 2月19日 雪が積もってました >>