Скрыть КАРТУ изображения и отобразить карту изображения для нового изображения

#jquery #image #map #hide

#jquery #изображение #словарь #скрыть

Вопрос:

Я много искал это, но не смог найти ответа…

(Я искал в 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>
  

Когда пользователь нажимает на
$(‘.serviceclass’).нажмите

я показываю

http://webvikas.net.in/befaft/images/index-up-03.png
введите описание изображения здесь которое меньше предыдущего

Очевидно, я не хочу (я хочу скрыть) более раннюю карту изображения) или карту изображения, созданную для этого изображения, и отображать новую карту изображения для меньшего изображения

пожалуйста, помогите

Я пытался

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

не работает

Также пробовал

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

Комментарии:

1. можно использовать одну карту изображения для обоих случаев и просто изменить размер изображения, карта соответствующим образом скорректируется

2. Я принимаю …. но если мне нужно изменить его размер до исходного, размер карты изображения не увеличивается до исходного размера …. в противном случае идеальное решение

Ответ №1:

Это приведет к изменению размера карты изображения в соответствии с изображением.

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