超初心者のためのホームページ作成講座
HTML CSS Dictionary Netscape Color AccessUp Links SiteMap
 Home > Netscape6でホームページをつくろう! > イメージマップ > Next 

■ イメージマップ(クリッカブルマップ)

画像を使ったリンクでは、1つの画像でリンク先は1つしか作成できませんでした。
イメージマップを使えば1つの画像から複数のリンクを作成することができます。
イメージマップのことをクリッカブルマップと言う場合もあります。
この1つの画像には四角形、円形、三角形、矢印が描かれていますが、それぞれにリンクを作成しています。それぞれの図形をクリックしてみて下さい。

4つの図形

イメージマップを作成するには、まず、画像を選択してから、画像アイコン をクリックして[画像のプロパティ]ダイアログボックスを開きます。
[画像マップ]の[編集]をクリックします。

画像マップ編集

[画像マップエディタ]が開きます。

画像マップエディタ

エディタの左端にボタンが4つついています。

[四角形]
2つめのボタンは四角形を選択するときに使います。
四角形ボタンをクリックしてから、画像の四角形の左上をクリックして、そのまま人差し指を離さずに右下までドラッグし、右下で指を離します。
自動的に[ホットスポットのプロパティ]が開きますので(開かなかったら失敗ですのでもう一度やり直して下さい)、[ホットスポット URL]にリンク先のURLを入力します。
[ホットスポットの代替テキスト]には、リンク先ページのタイトルまたはリンク先ページの説明などを入力します。

ホットスポットのプロパティ

[OK]をクリックすると、リンクが作成されます。

[円形]
画像マップエディタの3つめのボタンは円形(または長円形)を選択するときに使います。
画像の円の中心をクリックして、そのまま人差し指を離さずに右下(円周の真下を通る水平線と円周の真右を通る垂直線の交点)までドラッグし、右下で指を離します。
自動的に[ホットスポットのプロパティ]が開きますので、あとは四角形と同様に入力して下さい。

[多角形]
4つめのボタンは多角形を選択するときに使います。
三角形も矢印も多角形です。
多角形の選択は、全ての角をクリックします。最後の角(三角形ならば3つめの角)ではダブルクリックします。ダブルクリックすると、自動的に[ホットスポットのプロパティ]が開きますので同様に入力して下さい。

HOMEへ戻る Yahoo! JAPAN Netscape6でホームページをつくろう! infoseek
 Home < Netscape6でホームページをつくろう! < Back < イメージマップ > Next