Question

我目前正试图让这张图片映射起作用：

<img src="products1.png" usemap="products1-map" style="margin-bottom: 36px" />

<map id="products1-map" name="products1-map">

    <!-- Some comment -->

    <area shape="rect" coords="234,261,315,281" href="#" alt="Test">
    <area shape="rect" coords="218,282,314,318" href="#" alt="Test">

    <area shape="rect" coords="441,243,537,279" href="#" alt="Test">
    <area shape="rect" coords="416,278,512,314" href="#" alt="Test">

    <!-- Some comment -->

    <area shape="rect" coords="229,463,325,499" href="#" alt="Test">
    <area shape="rect" coords="218,500,314,536" href="#" alt="Test">

    <area shape="rect" coords="425,461,521,497" href="#" alt="Test">
    <area shape="rect" coords="416,497,512,533" href="#" alt="Test">

    <area shape="rect" coords="622,463,718,499" href="#" alt="Test">
    <area shape="rect" coords="615,495,711,531" href="#" alt="Test">

    <!-- Some comment -->

    <area shape="rect" coords="230,686,326,722" href="#" alt="Test">
    <area shape="rect" coords="216,722,312,758" href="#" alt="Test">

</map>

<img src="some-image1.png" style="float: right"/>

<img src="some-image2.png" style="margin-bottom: 16px"/>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

它在Chrome中运行得非常好，但不适用于IE或FF。

您如何解决此类问题？

非常感谢任何帮助：）

Answer 1

好的，我找到了您的问题，您错过#关于usemap名称，在这里：

<img src="img/da.png" usemap="#products1-map" style="margin-bottom: 36px" />

我希望现在一切正常：）

图片地图仅适用于Google Chrome

1 个答案: