Hide trigger (img) for popup, when I click on it-CodePudding

I have image in header, and when I click on the image a popup opens. I need to hide this image when popup is open and show when popup is closed. Second Image: 2

Website:https://clavis-schule.de/home-dev/

CodePudding user response：

If you're making use of event listeners you can swap out classes/styling of the element that is firing the event. Onclick works too but I personally only use it on button elements, choose what you prefer most

In case you're using jQuery you can use

$('img').on('click', (e) => {
    e.toggle()
});

https://api.jquery.com/toggle

alternatively if you're not using jQuery you could use

document.addEventListener('click', function (event) {
    event.target.classList.toggle("d-none")
}

// (more specifically)
document.getElementById("menu-img").classList.toggle("d-none")

where d-none is a bootstrap class. It could simply be a custom class as well

.d-none {
    display: none
}

You will need to toggle the image back when clicking away the modal and since you've provided no code example I can only tell you to figure that part out on your own.