- ベストアンサー
<map> HTML ヘルプ
partitaの回答
手書きHTMLなら、参照URLがいいでしょう。 Dreamweaverの機能を使用するのならもっと簡単に作成できますが、ヘルプを参照してみては？
関連するQ&A
- イメージマップ内での画像の変更【HTML・CSS・Java】
<img src="imagemaptest.bmp" usemap="#imagemaptest" border="0"> <map name="imagemaptest"> <area shape="rect" coords="152,167,359,451" href="***.html"> このようなタグでイメージマップを作成します。 そしてcoords="152,167,359,451"で指定したリンクにマウスオンした時に画像を変更する事は可能でしょうか？簡単に言うと画像の中のリンクにマウスを当てると指定した部分だけ画像が変更される方法です。 また、 background="test.jpg"でTABLE内に背景を指定し、その背景にリンクを張ることはかのうでしょうか？ おわかりになる方、お教え下さい(・・*)JavaでもCSSでもかまいません☆
- ベストアンサー
- HTML
- クリッカブルマップがきかない！？
html初心者です。 地図の画像上に複数のにクリッカブルマップを作成して、同ページ内のアンカーリンクへリンクを設定しています。 ※クリッカブルマップはDreamweaverで作成しています。 IEではちゃんとリンク先に行くのですが、ネスケだと、リンク先に移動しません。。どこが悪いのでしょうか？？ソースは下記にある通りです。 なにか決定的にタグが抜けているんでしょうか？？ 皆様、初心者な私にどうか教えてください。 よろしくお願いします。。。 ---------------------------------------------- <BODY> <div align="left"> <img src="image/map.gif" width="500" height="300" border="0" usemap="#Map"> <MAP name="Map"> <AREA shape="rect" coords="342,38,447,65" href="#01"> <AREA shape="rect" coords="333,108,439,144" href="#02"> </MAP> </div> <div> <A name="#01">一丁目</A> <A name="#02">二丁目</A> </div> </BODY>
- ベストアンサー
- HTML
- イメージマップで文章を表示したい。
下記の例のように、「map.gif」という画像の各箇所ごとにそれぞれのリンクを貼るのは下記の方法で出来ると思うのですが、 「coords="22,11,122,62"」にマウスが乗ったときに指定した箇所に文章を表示するにはどうしたらよいのでしょうか？ ※それぞれの箇所によって、それぞれ違った文章を表示したいです。 ※「map.gif」という画像が表示されている上段（下段でもＯＫ）に枠を作って、その中に説明文が表示される仕組み。 <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
- fancyboxにイメージマップを付けたい
早急に解決しなければいけない問題なのですが、どうしてもわからず途方にくれています。 どなたか助けていただけませんでしょうか。 fancyboxで表示したイメージ画像にイメージマップを付け、リンクを飛ばしたいと思っています。 https://gist.github.com/2972293 上記のサイトを参考にして一時は上手く行ったのですが、 いくつかの画像にそれぞれ個別のリンクを設定しようとしたところ、同じリンク先にしか飛ばない事に気付きました。 #Mapを増やせばいいのかなと思ったのですが（#Map2や#Map3など） 自分で書いても上手くいきませんでした。 どうすれば複数の画像に別々のリンク先を設定するようにできるでしょうか。 ご回答宜しくお願いします。 一応自分で書いたhtmlを載せておきます。 ----------------------------- <script type="text/javascript"> $(function() { $(".fancybox").fancybox({ padding:0, margin:0, onComplete: function() { $('#fancybox-img').attr('usemap', '#Map'); } }); }); </script> <a href="images/test.jpg" class="fancybox"><img src="images/test.jpg" alt="イメージ" width="138" height="111" /></a> <map name="Map" id="Map"> <area shape="rect" coords="317,347,547,364" href="http://yahoo.co.jp/" target="_blank" /></map> <a href="images/test2.jpg" class="fancybox"><img src="images/test2.jpg" alt="イメージ" width="138" height="111" /></a> <map name="Map" id="Map"> <area shape="rect" coords="317,347,547,364" href="http://google.co.jp/" target="_blank" /></map>
- ベストアンサー
- JavaScript
- 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
- 背景画像にクリッカブルマップでリンクを飛ばす方法
背景画像にクリッカブルマップを使用してリンクを設定したいと思っているのですが 上手く設定できません。 どなたかご教示頂けないでしょうか。そもそも出来ないものでしょうか？ ■CSSで書いているのは .bodytitle { background-image: url('http://**************/title.jpg' width="750" height="269" border="0" usemap="#maintop"); } ■HTMLのbodyの中に書いているのは <map name="maintop"> <area shape="rect" coords="12,10,280,80" href="http://******/" target="_blank"> <area shape="rect" coords="510,8,740,71" href="http://******/" target="_blank"> </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
- イメージマップで画像変え
イメージマップで作成したリンクボタンを使って別の場所の画像を変えることはできるのでしょうか? またイメージマップを使っている画像を上の方法で変えることはできますか? ↓のはためしに作っているプログラムですがうまく動きません。 <IMG SRC="picture1" WIDTH="500" HEIGHT="271" BORDER="0" usemap="#picture1" NAME="picture1"> <MAP name="picture1"> <a href="#" onMouseOver="document.picture2.src=btn.src;return true" onMouseOut="document.picture2.src=picture2.src;return true"> <AREA shape="rect" coords="365,62,373,70" ALT="ボタン"></a> </map>
- 締切済み
- JavaScript
- クリッカブルマップで同時にリンク
クリッカブルマップで、２つのページに同時にリンクさせたいのですが、下記のタグだと１ヶ所しかリンクができません。同時にリンクをさせるには、どんなタグをどのように追加したらいいのでしょうか。よろしくお願いします。 <MAP NAME="map1"> <AREA SHAPE="RECT" COORDS="*,*,*,*" HREF="xxx.html" target="migi"> </MAP>
- 締切済み
- HTML
- イメージマップでプルダウンメニューの設置方法
画像の上の一部分にリンクを設置する「イメージマップ」を設置し、そのリンクにカーソルが乗ると下にプルダウンメニューみたいのが伸びて、各々クリックするとリンクする設置方法を教えてください。 ３個リンクぐらい下に伸びるのが希望です。 以下の方法は、画像にリンクを設置した場合ですが、これからどのようなものを追加すればいいのでしょうか。 <img src="画像.gif" alt="" height="100" width="100" usemap="#画像" border="0"><map name="画像"><area shape="circle" coords="50,28,27" href="URL" alt="リンク1"></map>
- 締切済み
- HTML