余り使う機会はありませんが、それ故に毎回悩むのが画像に貼ってあるイメージマップのメンテナンス。

マップをクリックしてリンク先のURLを確認すればいいんだけど、この間の日本地図みたいに沢山ある場合はいったりきたりがなかなかに大変ですし、フレーム（IFRAME含）使ってたりするようなとこだと尚更確認が難しくなります。

なので、ちょっとでも楽できないかといろいろ試していた所、とりあえずリンク先をチェックするのだけは簡単に出来る方法を見つけました。

やり方

やり方は非常に簡単で、デベロッパーツールでクリッカブルマップになっている画像のリンク部分を調べるだけです。

Cmd+Opt+I（WindowsならF12でもOKかも）でデベロッパーツールを開いたら、左下にある虫眼鏡アイコンをクリックします。

すると、要素を選択するモードになりますよね。これで狙った要素をクリックすると、その要素の行がハイライトされるわけですが、これをクリッカブルマップが設定された画像のリンク上で行うと（つまり、虫眼鏡でマップ付き画像のリンク部分を調べると）ちゃーんと該当する「area」タグがハイライトされるんですね。

なので、その「area」タグの「href」属性を読めばとりあえずリンク先は調べられそうです。

ただ、やっぱりクリック可能な領域を調べることはできません。。

いや、もちろん座標はでてますのでこの言い方は違うかもしれませんけど、数字ばっかり並んでても具体的にどの範囲なのかはわかりにくいですよね。

Dreamweaverみたいにクリックできる範囲をハイライトする方法とかエクステンションがあれば便利そうなんですけどねぇ。

あ、Firebugではどうなのかは判らないです。普段Fox使わないもんで…。