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

#html

Вопрос:

enter code here Я работаю над программой для RVER, которые путешествуют полный рабочий день. Я пытаюсь найти значок карты Google, и когда вы наведете на него курсор мыши, на нем отобразится карта штата, в котором находится парк кемпингов. Мне также нужна вторая кнопка для удобств парка, и когда вы наведете курсор мыши на кнопку, появится фотография удобств. Этот код работает для одной кнопки. Я перепробовал все, что знаю, чтобы заставить работать и то и другое. пожалуйста, посоветуйте».

 `lt;!DOCTYPE HTMLgt;  lt;headgt;  lt;meta charset="utf-8"gt;  lt;titlegt;Image hover demolt;/titlegt;  lt;stylegt;  #img2{  position: fixed;  right:0;  top:0;  display: none;  }  lt;/stylegt;  lt;/headgt;  lt;bodygt; lt;img id="img1" src="http://fbook123.com/smf/images/gmap.png" /gt; lt;img id="img2" src="http://fbook123.com/smf/images/hidencovemap.png" /gt;  lt;scriptgt;  var img1 = document.getElementById("img1"),  img2 = document.getElementById("img2");   img1.onmouseover = function(){  img2.style.display = "block";  }   img1.onmouseout = function(){  img2.style.display = "none";  }  lt;/scriptgt;  lt;/bodygt; `  

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

1. Приведенный выше код работает, но он будет нажимать только одну кнопку и отображать карту при наведении курсора мыши, мне нужно, чтобы он также отображал кнопку удобств, но.png, и когда вы наведете на нее курсор мыши, изображение удобств hcamen.png будет отображаться так же, как на карте.

2. вы должны показать доказательство части «Я перепробовал все, что знаю, чтобы заставить работать и то и другое» .

Ответ №1:

Я решил эту ошибку, используя атрибут источника.

Измените HTML-код на:

 lt;img id="img1"   src="http://fbook123.com/smf/images/gmap.png"   onmouseover="document.getElementById("img2").style.display = 'block';"  onmouseleave="document.getElementById("img2").style.display = 'none';" /gt; lt;img id="img2" src="http://fbook123.com/smf/images/hidencovemap.png" /gt;  

Затем вы можете стереть часть сценария, которая уменьшает код.

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

1. Я попробовал это, и карта все время остается включенной.