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为有效的......因此会忽略它们。

最好的解决方法是将整个map元素创建为字符串,然后将整个map元素与 child 一起附加area到 DOM

或者

等待 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 回答