サイズ

basic.gif (3042 バイト)

 画像のサイズを変更する。Part1

次は画像のサイズを変更しよう。
画像のサイズを変更する場合の命令は実は一つ前の表示部分のサイズ変更と同じなんだ。

★.style.▲ = ■;・・・・・★のサイズを▲に■の大きさにする。
▲:width , height
■:▲のサイズ

けれど、今回は画像のサイズ指定だよね。
だから、この命令は<IMG>タグを操作するんだよ。
(前回はボックスを操作した)

下の表の左
<IMG src="../../../sozai/icon/ikimono/76.gif" id="img" >
↑普通に画像を指定しただけ

下の表の右
<A onclick="img.style.width=10;img.style.height=10;">10×10</A><br>
<A onclick="img.style.width=36;img.style.height=36;">36×36</A><br>
<A onclick="img.style.width=70;img.style.height=70;">70×70</A><br>
↑それぞれで、サイズの変更をしている。

これを実行すると、


↑いろんな大きさに変わるよ
10×10
36×36
70×70

↑好きなのをクリックしてごらん

画像を徐々に大きくしていくプログラムで、迫ってくる画像なんていうのも作れるね。


back.gif (1116 バイト) ボックスのサイズを変更する
next.gif (705 バイト) 画像のサイズを変更するPart2