Скрыть координаты карты изображения, когда javascript отключен

У меня есть карта изображения, и я хочу скрыть ее интерактивные координаты, когда Javascript отключен, чтобы осталось только изображение. Я попытался использовать noscript в теле html:

<noscript>
  <style type='text/css'>
    area {display:none}
  </style>
</noscript>

но координаты области по-прежнему отображаются под изображением. Как я могу полностью скрыть их (желательно, используя чистый css или чистый javascript)?


person JAT86    schedule 28.06.2017    source источник
comment
просто не показывать их по умолчанию и показывать через javascript   -  person mehulmpt    schedule 29.06.2017
comment
Как скрыть их по умолчанию? display:none или visibility:hidden не работает, даже в теге карты. Я хочу сохранить образ.   -  person JAT86    schedule 29.06.2017
comment
Вы можете продублировать изображение и сделать второе без атрибута usemap, а затем переключать display: none в одно или другое, как вы делаете.   -  person yuriy636    schedule 29.06.2017
comment
Карта местности 2017 года?   -  person tomysshadow    schedule 29.06.2017
comment
Спасибо за блестящую идею. Можно ли использовать javascript для добавления атрибутов usemap (для img) или имени (для карты)? У меня есть несколько больших карт изображений, и дублирование изображения было бы довольно утомительным. Я мог бы просто удалить эти атрибуты по умолчанию. Я пробовал следующее, но они не работают: var mapImage = document.getElementById('imageMap'); var att = document.createAttribute('usemap'); att.value = '#mapmap'; mapImage.setAttributeNode(att); или document.getElementsByTagName(map).setAttribute(name, mapmap);   -  person JAT86    schedule 29.06.2017


Ответы (1)


Вместо отключения карты изображений, если JavaScript недоступен, почему бы не включить ее, только если JavaScript доступен? Поскольку вы хотите, чтобы карта отображалась только при включенном JS, для ее включения можно использовать JS. Браузеры с отключенным JS не смогут запустить код и будут отображать только изображение.

var myMappedImages = document.getElementsByClassName("myMappedImage");
for(var i=0,len=myMappedImages.length;i<len;i++){
    myMappedImages[i].usemap = "#myimagemap";
}
person tomysshadow    schedule 29.06.2017
comment
Я пробовал это, но не смог добавить атрибут usemap. Я также сделал это, но безрезультатно: document.getElementById(imageMap).useMap = #mapmap; - person JAT86; 29.06.2017