0

この静的バージョンでは、どのブラウザーでも、閉じる領域をクリックしてhttp://www.google.comにジャンプできます。

<html>
  <body>
    <div id="my_div">
        <img usemap="#map"
            src="http://specialmedia.wnyc.org.s3.amazonaws.com/ads/open.jpg" />
        <map name="map" id="map">
            <area shape="rect" coords="900,0,1000,20"
                href="http://www.google.com/" target="" alt="" />
        </map>
    </div>
  </body>
</html>

この動的バージョンは同一である必要があり、IE6、IE7、および IE8 を除くすべてのブラウザーに含まれています。IE では、マップは効果がありません。

<html>
  <head>
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("jquery", "1");
    </script>
  </head>
  <body>
    <div id="my_div"></div>
    <script>
      var img = $("<img/>").attr("usemap", "#map");
      img.attr("src", "http://specialmedia.wnyc.org.s3.amazonaws.com/ads/open.jpg");
      var map = $("<map/>").attr("name", "map").attr("id", "map");
      var area = $("<area/>").attr("shape", "rect");
      area.attr("coords", "900,0,1000,20")
      area.attr("href", "http://www.google.com/").attr("target", "")
      area.attr("alt", "");
      map.append(area);
      $("#my_div").append(img).append(map);
    </script>
  </body>
</html>

IE で Javascript によって生成されたイメージ マップを作成する方法はありますか? 私はすでに試し$(document.ready(...ました。

4

1 に答える 1

1

jquery にはバグがあり (1.4 で修正する必要があります) 、要素areaに追加できません。map

私が間違っているかもしれませんが、追加される HTML タグが最初にdiv要素内に作成され、IE がs 内のareaタグdivを有効であると認識せず、無視するためです。

最善の回避策は、要素全体を文字列として作成し、要素全体を子とともにDOMにmap追加することです。maparea

または

jquery 1.4 がリリースされるのを待ちます...

例えば

var map=$("<map name='map' id='map'><area coords='900,0,1000,20' href='http://www.google.com/' alt='' /></map>");
$("#my_div").append(img).append(map);
于 2010-01-11T19:38:21.260 に答える