docker
/
docs
mirror of https://github.com/docker/docs.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

add check in modal.js

This commit is contained in:
craig-osterhout 2023-04-19 08:29:30 -07:00
parent f08c1fe3d2
commit eb774bd5fd
No known key found for this signature in database
GPG Key ID: 497A5E49261C73B5
1 changed files with 28 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
assets/js/modal.js
View File

@ -1,31 +1,33 @@
// Get the modal for image 1 // Get the modal for image 1
var modal = document.getElementById("img-modal1"); var modal = document.getElementById("img-modal1");
// Get the image and insert it inside the modal - use its "alt" text as a caption // If modal exists, get the image and insert it inside the modal - use its "alt" text as a caption
const images = document.querySelectorAll("main img"); if (modal) {
var modalImg = document.getElementById("img-modal-img1"); const images = document.querySelectorAll("main img");
var captionText = document.getElementById("img-modal-caption1"); var modalImg = document.getElementById("img-modal-img1");
function handleImageClick(event) { var captionText = document.getElementById("img-modal-caption1");
modal.style.display = "block"; function handleImageClick(event) {
modalImg.src = event.target.src; modal.style.display = "block";
modalImg.alt = event.target.alt; modalImg.src = event.target.src;
captionText.innerHTML = event.target.alt; modalImg.alt = event.target.alt;
window.addEventListener("keydown", handleModalClose) captionText.innerHTML = event.target.alt;
} window.addEventListener("keydown", handleModalClose)
images.forEach(image => image.addEventListener("click", handleImageClick))
// Get the element that closes the modal
var span = document.getElementById("img-modal-close1");
function handleModalClose(event) {
if (event.type==="click"||event.key==="Escape"){
modal.style.display = "none"
window.removeEventListener("keydown", handleModalClose)
} }
} images.forEach(image => image.addEventListener("click", handleImageClick))
modal.addEventListener("click", handleModalClose)
// When the user clicks on (x), close the modal
span.onclick = function(){ // Get the element that closes the modal
modal.style.display = "none"; var span = document.getElementById("img-modal-close1");
} function handleModalClose(event) {
if (event.type==="click"||event.key==="Escape"){
modal.style.display = "none"
window.removeEventListener("keydown", handleModalClose)
}
}
modal.addEventListener("click", handleModalClose)
// When the user clicks on (x), close the modal
span.onclick = function(){
modal.style.display = "none";
}
}