• ベストアンサー

イメージマップをクリックしたら枠がでてしまいます。

<area shape="rect" coords="288,1,429,195" href="index.html" alt="ホーム"> このように画像にイメージマップでエリア設定したのですが、クリックするとイメージマップの枠がオレンジ色で表示されてしまいます。 CSSでborder:none;を適応させているんですが、枠が消えません。 普通の画像の枠は表示されません。イメージマップだけです。 どうしたら消えるでしょうか? よろしくお願いいたします。

質問者が選んだベストアンサー

  • ベストアンサー
  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.1

普通に area:active{outline:none;} で消えませんか?

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • map初心者です

    名前の付け方がわかりません。 なんでもいいのでしょうか?とりあえずわからないので画像名と同じ名前に設定しました。 また、下の記述が全部なのですが画像しかアップされません。 リンクすらなりません。 どこがおかしいのでしょうか。よろしくお願いします。 <img src="img/1.jpg" usemap="#1map" border="0"> <map name="1map">  <area shape="rect"   coords="220,148,179,200"   href="http://12345" alt="**" target="_blank">  <area shape="rect"   coords="358,125,181,126"   href="http://12345" alt="**" target="_blank">  <area shape="rect"   coords="167,336,178,141"   href="="http://12345" alt="**" target="_blank">  <area shape="rect"   coords="178,338,180,214"   href="="http://12345" alt="**" target="_blank"> </map> 関係あるかわかりませんが、使っているのはロリポップです。

    • ベストアンサー
    • HTML
  • mapが機能しない

    以下のようにmapを設置しましたが、全く機能しません。何が考えられるでしょうか? <div><img src="images/head.jpg" alt="" usemap="#map" border="0"/></div> <map name="map"> <area href="kan.html#3" alt="" shape="rect" coords="0,3,105,154" /> <area href="kan.html#2" alt="" shape="rect" coords="314,3,393,154" /> <area href="kan.html#1" alt="" shape="rect" coords="106,3,211,146" /> </map>

    • ベストアンサー
    • HTML
  • イメージマップで文章を表示したい。

    下記の例のように、「map.gif」という画像の各箇所ごとにそれぞれのリンクを貼るのは下記の方法で出来ると思うのですが、 「coords="22,11,122,62"」にマウスが乗ったときに指定した箇所に文章を表示するにはどうしたらよいのでしょうか? ※それぞれの箇所によって、それぞれ違った文章を表示したいです。 ※「map.gif」という画像が表示されている上段(下段でもOK)に枠を作って、その中に説明文が表示される仕組み。 <img src="map.gif" alt="サンプル" usemap="#sample"> <map name="sample"> <area shape="rect" coords="22,11,122,62" href="map1.html" alt="リンク1"> <area shape="circle" coords="184,86,30" href="map2.html" alt="リンク2"> <area shape="poly" coords="87,78,30,110,81,139,69,113" href="map3.html" alt="リンク3"> <area shape="default" href="map4.html" alt="リンク4"> </map> 宜しくお願いします。

    • ベストアンサー
    • HTML
  • 吹き出しに画像とコメントを入れるプログラム

    下記のプログラムで吹き出しを作成して 画像とコメントを表示したいのですが なかなか出来ず困っております。 方法がありましたらよろしくお願いいたします。 <img src="画像名" usemap="#map" border="0"> <map name="map"> <area shape="rect" coords="305,60,390,126" href="アドレス" alt="北海道"> <area shape="rect" coords="288,151,331,181" href="アドレス" alt="青森"> <area shape="rect" coords="280,181,311,221" href="アドレス" alt="秋田"> <area shape="rect" coords="310,181,341,221" href="アドレス" alt="岩手"> <area shape="rect" coords="275,221,305,245" href="アドレス" </map>

  • クリッカブル・マップのリンクが効かない

    下記のコードでpngの画像上でリンクをつけましたが、カーソルをかざしても反応が有りません。どこが間違っているのでしょうか? 皆様、ご教授お願いします <table width="750" align="center"> <tbody> <tr><td> <img src="top2.png" usemap="#top2"> <map name="top2"> <area shape="rect" coords="20,197,63,206" href="http://------.html" alt="A"> <area shape="rect" coords="78,198,121,206" href="http://------.html" alt="b"> <area shape="rect" coords="137,198,181,206" href="http://------.html" alt="c"> <area shape="rect" coords="196,198,239,206" href="http://------.html" alt="d"> <area shape="rect" coords="19,163,63,272" href="http://------.html" alt="e"> <area shape="rect" coords="77,264,121,272" href="http://------.html" alt="f"> </map> </td> </tr> </tbody> </table>

    • 締切済み
    • XML
  • 画像に複数リンクをはる方法(イメージマップ)

    画像は表示されるのですが、リンクがはれません。 どこがおかしいのでしょうか? リンクをはる画像と、リンク先は別フレームで、表示させたいフレームの名前はinです。 ついでに、リンクをクリックした瞬間に出る点線の消し方もわかる方がいたら教えてください。 よろしくお願いします。 タグ(html内)↓ <body> <img src="http:~" usemap="mn"> </body> <map name="mn"> <area shape="rect" coords="298,298,355,262" href="http:~l"target="in"> <area shape="rect" coords="298,276,319,285" href="http:~"target="in"> <area shape="rect" coords="324,273,362,288" href="~html" target="in"> <area shape="rect" coords="367,276,399,286" href="~html" target="in"> </map>

  • クリッカブルマップのリンクが‥

    クリッカブルマップでリンクさせたくて、記述いたしましたが、リンクが有効になっていません。 ブラウザ上では画像表示のままでハイパーリンクになっておらず、目的のページへ行けない状態です。 これは何が原因でしょうか。 以下、htmlの記述です。みなさま、どうかご教授のほどお願いします。 <img src="./images/menu1.jpg" usemap="#linkmap" border="0" height="81" width="500"> <map name="linkmap"> <area shape="rect" coords="x15,y22,x88,y53" href="$home" alt="ホーム"> <area shape=rect coords="x88,y22,x203,y53" HREF="http://"> <area shape=rect coords="x201,y22,x310,y53" HREF="./index.cgi?mode=top"> <area shape=rect coords="x309,y22,x418,y53" HREF="http://"> </map>

  • アイフレームとクリッカブルマップ

    こんばんわ、イメージマップ(クリッカブルマップ)とアイフレームを 一緒に使いたいのですが、どうしてもできません><   マップのソースが <IMG src="背景画像" usemap="#g" border="0"> <MAP name="g"> <AREA shape="poly" coords="470,471,466,479,457,482,448,479,445,471,448,463,457,460,466,463" href="★" target="aifurenaka" alt="MEMO"><!-- MEMO --> <AREA shape="poly" coords="547,464,543,472,534,475,525,472,522,464,525,456,534,453,543,456" href="★" target="aifurenaka" alt="ABOUT"><!-- ABOUT --> <AREA shape="poly" coords="622,470,618,478,609,481,600,478,597,470,600,462,609,459,618,462" href="★" target="aifurenaka" alt="BOARD"><!-- BOARD --> <AREA shape="poly" coords="692,467,688,475,679,478,670,475,667,467,670,459,679,456,688,459" href="★" target="aifurenaka" alt="MIX"><!-- MIX --> <AREA shape="default" nohref><!-- デフォルトエリア --> </MAP>

  • クリッカブルマップでリンクを貼ったとき…

    クリッカブルマップでリンクを貼ったとき、リンク周りにborderのような、枠、色をつけることはできないのでしょうか? <IMG SRC="photo/建物配置図.jpg" ALT="選択してね" border="0" usemap="#haitizu"> <map name="haitizu"> <area shape="rect" coords="185,247,240,303" href="taikukann.html"" alt="体育館"> </map>

    • ベストアンサー
    • HTML
  • map が機能しない

    <div><img src="images/topbar.gif" alt="" usemap="#map2" border="0" /></div> <map name="map2"> <area href="site.html" alt="" shape="rect"coords="394,57,495,68" /> <area href="toi.html" alt="" shape="rect" coords="510,57,605,68" /> </map> 上記のようにリンクを画像上に設置しましたが、IE6では機能しませんでした。 原因はalphafilter.jsというジャバスクリプトを使用していたからです。、これはサイトの外枠に影を入れるため、透過png の画像を使用したいためです。透過pngをIE6で有効にするためにalphafilter.js を使ったわけす。 mapを機能させるためにはalphafilter.jsを外さなければなりません。 IE6で外枠の影、map両方を機能させる良い方法はないでしょうか? CSSハックでIE6のみ透過gifを使うという方法はとりたくないです。何故なら透過gifは画像が粗いからです。

    • ベストアンサー
    • HTML