／／／ クリッカブルマップ ／／／ (00/08/02)
右の画像はトップ画面で使っているリンク用の画像です。 今はクリッカブルマップの指定をしていないのでリンクの 機能はありません。また七つのバーが表示されていますが、 実際は一つの画像です。このように画像に範囲を作って その範囲の部分がクリックされた時にリンクする機能を クリッカブルマップと云います。 画像は何でも良いわけで、日本地図にすれば手間はかかり ますが、各都道府県毎にリンクさせることも可能です。 |
|
以下がソース部分です。 -------------------------------------------------------------- <img src="annai01.gif" width="180" height="220" USEMAP="#map_annai01.gif" border="0"> リンク用の画像（annai01.gif）を表示させ、クリッカブルマップの指定をしています。 <MAP NAME="map_annai01.gif"> <AREA SHAPE="rect" COORDS="5,5,170,24" ALT="" HREF="gal.html"> 画像の座標 5,5-170,24 で囲まれる四角形は gal.html にリンクさせる指定です。 gal.html は「ぎゃらり〜」です。以下同じように指定します。 <AREA SHAPE="rect" COORDS="5,30,170,48" ALT="" HREF="won.html"> <AREA SHAPE="rect" COORDS="5,57,170,75" ALT="" HREF="rai.html"> <AREA SHAPE="rect" COORDS="5,83,170,100" ALT="" HREF="temp.html"> <AREA SHAPE="rect" COORDS="5,110,170,128" ALT="" HREF="temp.html"> <AREA SHAPE="rect" COORDS="5,136,73,159" ALT="" HREF="/cgi-bin/ −− チャット、掲示板と続きますが、長いので省略 −−− </MAP> この例では四角形の範囲の指定ですが、他に円、多角形による指定、指定領域外と云う 指定の仕方があります。 ( X が横方向、Y が縦方向） 四角形："rect" X1,Y1,X2,Y2 正 円："circle" 中心 X,中心 Y,半径 多角形："poly" X1,Y1 … Xn,Yn（偶数個で指定） 領域外："default" 写真などの jpg 画像でも使えますので、写真の特定範囲でもってリンクさせる ことも可能です。お試しを〜