닫기 버튼이 안되는데 수정해야할 부분이 어딘지 문의 드립니다
div class="black-bg">
<div class="white-bg">
<h4>Login</h4>
<button class="btn btn1" id="close">닫기</button>
</div>
</div>
<style>
.black-bg {
width: 100%; height: 100%;
position: fixed;
background: rgba(0,0,0,0.5);
z-index: 5;
padding: 20px;
display: none;
}
.show-modal {
display: block;
}
.white-bg {
background: white;
border-radius: 5px;
padding: 30px;
}
.btn{
background-color: rgb(162, 133, 133);
border-radius: 5px;
padding: 10px;
}
</style>
<button id="login">Login</button>
<script>
/*document.getElementById('login').addEventListener('click',function () {
}) */
$('#login').on('click', function () {
//document.querySelector('.black-bg').classList.add('show-modal')
$('.black-bg').addClass('show-modal');
})
document.getElementById('close').addEventListener('click',function () {
document.querySelector('.black-bg').classList.add('show-modal')
})
</script>
