• 締切済み

JQueryでのリンク・・

turn.jsというページをめくるアニメーションをするJQueryをつかっているのですが HTMLの中で、 <div id="**"> <div style="background-image:url(**);"></div> <div style="background-image:url(**);"></div> <div style="background-image:url(**);"></div> <div style="background-image:url(**);"></div> </div> のように画像一枚ずつ指定していくのですが、このdiv要素の画像の中にリンクを埋め込むこと は可能でしょうか? <div style="background-image:url(**)"><img src="**.jpg"usemap="#map" /><map name="map"><area shape="rect" coords="452,248,737,290" href="http://**" /></map></div> 上記のやりかただと適用されないので困っています。

みんなの回答

  • warpspace
  • ベストアンサー率56% (83/147)
回答No.1

onclickでリンク先を指定すればできますよ。 <div style="background-image:url(**);" onclick="location.href='http://**'"></div>

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

関連するQ&A

  • 背景画像にクリッカブルマップでリンクを飛ばす方法

    背景画像にクリッカブルマップを使用してリンクを設定したいと思っているのですが 上手く設定できません。 どなたかご教示頂けないでしょうか。そもそも出来ないものでしょうか? ■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> お手間おかけしますがどうぞよろしくお願い致します。

  • background-imageが表示されない

    ヘッダーの部分の背景画像が表示されません。 CSS #header { height: auto; display:block; margin:0px;padding:0px;width:100%; background-image: url(../images/mainback.png); } HTML <div id="header"> <div><img src="images/topbar2.gif" alt="" usemap="#map2" border="0" /></div> <map name="map2"> <area href="s.html" alt=""shape="rect"coords="394,57,495,68" /> <area href="t.html" alt=""shape="rect"coords="510,57,605,68"/></map> <div><img src="images/main.png" alt="" usemap="#map1" border="0" /></div> </div> 上記のようにヘッダー画像の下に背景画像をつけたいのですが、画像がある場合背景画像は重ならないんでしょうか?

    • ベストアンサー
    • HTML
  • 画像マップしたリンク先をクリックするとフェードでリンク先のページに切り

    画像マップしたリンク先をクリックするとフェードでリンク先のページに切り替わることなどできないでしょうか?? 問題のコードです <div id="main_ex"> <img id="mg" src="site02/ex_top03.jpg" usemap="#hisigata" border="0" /> <map name ="hisigata"> <area shape="rect" coords="10,498,149,532" href="site02/ex_01.htm"> <area shape="rect" coords="582,468,790,496" href="site02/ex_02.htm"> <area shape="rect" coords="800,465,932,493" href="site02/ex_03.htm"></div> href="site02/ex_01.htmに切り替わるときにフェードで切り替わりたいです。 (site02/ex_02.htm site02/ex_03.htmも同様) jQuery でも javascriptでもかまいません。 なにかよい考えございましたらぜひお教え願えたらと思います。 甘えた質問で申し訳ありませんが、よろしくお願いいたします。

  • TABLEでのリンクについて

    画像の中の指定した部分から違うページへリンクさせたくて <img src="image/ie.gif" width="550" height="285" border=0 usemap="#map1"> と入力してその後に <map name="map1"> <area shape="rect" coords="249,169,295,220" href="link.htm"> </map> としてリンクさせました。 その後に画像の上に違う画像を重ねたくて最初の画像をTABLEの背景にしようと思って <table background="image/ie.gif" width="550" height="285" border=0 usemap="#mapie"> と直しました。 そうすると画像を重ねる事はできたのですが、リンクができなくなってしまいました。 TABLEの背景画像から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
  • クリッカブル・マップのリンクが効かない

    下記のコードで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>

  • クリックしてリンク先に移動する地図をwebに掲載しましたが

    ホームページに地図の画像を掲載して、 その地図にいくつかのクリックできるポイントを設定し、 それぞれリンク先に移動するようにしました。 IEではキレイに地図の画像が表示できているのですが、 FireFoxとか、Netscapeでは地図に青い外枠が表示されます。 赤を基調にしたサイトなので不自然な感じがして困っています。 どのようにこれを回避したらよいのでしょうか。 具体的に下記付け加えるもの等ございましたら教えてください。 よろしくお願いします。 <MAP NAME=map1> <AREA SHAPE=rect COORDS="112,2,196,28" HREF="room1.htm"> <AREA SHAPE=rect COORDS="213,3,298,28" HREF="room2.htm"> <AREA SHAPE=rect COORDS="310,2,399,28" HREF="room3.htm"> <AREA SHAPE=rect COORDS="413,2,495,28" HREF="room4.htm"> <AREA SHAPE=rect COORDS="513,1,594,27" HREF="room5.htm"> <AREA SHAPE=rect COORDS="614,2,701,28" HREF="room6.htm"> </MAP><IMG USEMAP="#map1" SRC="worldmap.gif" WIDTH=702 HEIGHT=29 ALIGN=bottom>

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

    下記のプログラムで吹き出しを作成して 画像とコメントを表示したいのですが なかなか出来ず困っております。 方法がありましたらよろしくお願いいたします。 <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>

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

    クリッカブルマップでリンクさせたくて、記述いたしましたが、リンクが有効になっていません。 ブラウザ上では画像表示のままでハイパーリンクになっておらず、目的のページへ行けない状態です。 これは何が原因でしょうか。 以下、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>