Line 117: | Line 117: | ||
ul.onclick = function(event) { | ul.onclick = function(event) { | ||
var target = getEventTarget(event); | var target = getEventTarget(event); | ||
− | alert(target.alt); | + | alert(target.src); |
+ | var modal = document.getElementById('PopupModal'); | ||
+ | |||
+ | // Get the image and insert it inside the modal - use its "alt" text as a caption | ||
+ | var img = target.alt; | ||
+ | var modalImg = document.getElementById("img01"); | ||
+ | var captionText = document.getElementById("caption"); | ||
+ | modal.style.display = "inline"; | ||
+ | modalImg.src = target.src; | ||
+ | |||
+ | |||
+ | captionText.innerHTML = target.alt; | ||
+ | // Get the <span> element that closes the modal | ||
+ | var span = document.getElementsByClassName("close")[0]; | ||
+ | |||
+ | // When the user clicks on <span> (x), close the modal | ||
+ | span.onclick = function() { | ||
+ | modal.style.display = "none"; | ||
+ | } | ||
}; | }; | ||
</script> | </script> |
Revision as of 18:51, 14 August 2018
×