隐藏图像MAP并显示新图像的图像MAP

Question

我已经搜索了很多但找不到答案......

（我在Google搜索“如何隐藏图片地图区域”）

我正在使用

<script src="http://code.jquery.com/jquery-2.0.3.js"></script>

---

此图像地图创建的图像的链接

http://webvikas.net.in/befaft/images/index-03.png

图像映射....（上图）

---

<map name="Map" id="Map1"  >


<area shape="rect" coords="28,134,225,324" href="#" id="printingservice.php" alt="Printing Service" class="serviceclass" style="display:none">


 <area shape="rect" coords="278,311,472,494" href="#" id='awardwork.php' alt="Award Works" class="serviceclass" style="display:none">



<area shape="rect" coords="538,343,734,534" href="#" id='onsitestudio.php' alt="Onsite Studio" class="serviceclass" style="display:none">



 <area shape="rect" coords="759,314,962,497" href="#" id='webservices.php' alt="Web Services" class="serviceclass" style="display:none">



 <area shape="rect" coords="716,107,905,295" href="#" id='graphicdesigning.php' alt="Graphic Designing" class="serviceclass" style="display:none">



 <area shape="rect" coords="505,142,694,324" href="#" id='artworkadaption.php' alt="Artwork Adaption" class="serviceclass" style="display:none">



<area shape="rect" coords="246,102,447,286" href="#" id='imageediting.php' alt="Image Editing" class="serviceclass" style="display:none">



<area shape="rect" coords="67,337,255,524" href="#" id='printproduction.php' alt="Print Production" class="serviceclass" style="display:none">

</map>

---

用户点击时     $（”。服务类）。然后按

我正在展示

http://webvikas.net.in/befaft/images/index-up-03.png 比前一个小一个

显然，我不想（我想隐藏）早期图像MAP）或为此图像创建的图像MAP，并为较小的图像显示新的图像MAP

请帮助

我试过

<map name="Map" id="Map1" style="display:none">

不起作用

也试过

 $('.serviceclass').hide();
$('#Map1').hide();

Answer 1

这将使图像地图随图像调整大小。

https://github.com/davidjbradshaw/image-map-resizer