JS overlay schließen?
ich habe eine Problem mit meiner schließungs-funktion.
$('#overlay-contact').on('click', function(ev) {
console.log(ev.target)
if (ev.Target = $('#overlay-wrapper-contact')) {
$("#overlay-contact").removeClass('show-overlay');
}
});die Class 'show-overlay' wird durch einen Button hinzugefügt
$('#toggle-btn-contact').on('click', function(){
var elem = $('#overlay-contact');
elem.addClass("show-overlay");
});<div id="overlay-contact" class="overlay">
<div id="overlay-wrapper-contact" class="overlay-wrapper">
<div class="o_contact-form">
<form action="index_submit" accept-charset="utf-8">
<textarea placeholder="Name:" name="Name"></textarea>
<textarea placeholder="E-Mail:" name="E-mail"></textarea>
<textarea placeholder="Anliegen:"></textarea>
</form>
</div>
</div>
</div>#overlay-contact.overlay
display: none
position: fixed
height: 100vh
width: 100vw
background: $bg-color
z-index: 999
.overlay-wrapper
display: flex
margin: auto
background: red
padding: 25px
#overlay-contact.show-overlay
display: flex
.overlay-wrapper
animation: slide-down 0.5s ease
das Problem ist das wenn ich außerhalb clicke geht das overlay weg (wie es ja soll), aber wenn ich innerhalb clicke geht es auch weg :/
hier noch als CodePen für (hoffentlich) bessere Übersicht
https://codepen.io/Ezio__/pen/JNevya
hoffe einer kann helfen :)
HTML,
Event,
JavaScript,
schliessen,
Overlay,
Target
