Javascript issuesssss!!!!!!!!!

can someone explain to me how i make the script so i can can click the second image and have it enlarge like the first image does...heres the code.... <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <img id="myImg" src="http://i64.tinypic.com/4ih8ug.jpg" alt="atom" style="width:90%;max-width:200px"> <img id="myImg" src="http://i64.tinypic.com/4ih8ug.jpg" alt="atom" style="width:90%;max-width:200px"> <div id="myModal" class="modal"> <span class="close">×</span> <img class="modal-content" id="img01"> <div id="caption"></div> </div> <script> var modal = document.getElementById('myModal'); var img = document.getElementById('myImg'); var modalImg = document.getElementById("img01"); var captionText = document.getElementById("caption"); img.onclick = function(){ modal.style.display = "block"; modalImg.src = this.src; captionText.innerHTML = this.alt; } var span = document.getElementsByClassName("close")[0]; span.onclick = function() { modal.style.display = "none"; } </script> </body> </html>

javascript

5th Jul 2018, 9:13 PM

David CHAMPION

2 Answers

+ 3

Hi David Woods Only one element can have a Id name which cant be used again by another element This means that you cannot use the same name for both images Change: <img id="myImg" src="http://i64.tinypic.com ....... <img id="myImg" src="http://i64.tinypic.com ....... To: either different Id names such as img1 and img2 Not img for both as Id cannot be used twice with same name OR Use class = img for both instead of id Class names can be used multiple times Remember: Ids are Unique (only one element can have a name) Classes are not unique (same name can be used across multiple elements)

5th Jul 2018, 9:50 PM

Agent

@agent i kind of understand what you are saying, but i tried changing the names "myimg1" "myimg2" and it does nothing, can you please show me an example of how to do this?

5th Jul 2018, 10:05 PM

David CHAMPION