jQuery 사용법 간단정리 듣고 숙제했는데 css 에 show-modal을 추가해야하는 이유가 뭔가요? 기존에 있던 show 를 사용하려고하는데 꼭 show-modal로만 해야 잘 되네요. 반면에 밑에 있는 navbar-toggler는 새로만든 show-modal로 바꿔도 잘 작동하구요.
<nav class="navbar navbar-light bg-light">
<div class="container-fluid">
<span class="navbar-brand">Navbar</span>
<button class="navbar-toggler" type="button">
<span class="navbar-toggler-icon"></span>
</button>
</div>
</nav>
<ul class="list-group" id="test1">
<li class="list-group-item">An item</li>
<li class="list-group-item">A second item</li>
<li class="list-group-item">A third item</li>
<li class="list-group-item">A fourth item</li>
<li class="list-group-item">And a fifth one</li>
</ul>
<div class="black-bg">
<div class="white-bg">
<h4>로그인하세요</h4>
<button class="btn btn-danger" id="close">닫기</button>
</div>
</div>
<button id="login">로그인</button>
<script>
$('#login').on('click', function () {
$('.black-bg').addClass('show'); <--- 이부분을 무조건 show-modal 써야 작동하는이유
});
document
.querySelector('.navbar-toggler')
.addEventListener('click', function () {
document.querySelector('.list-group').classList.toggle('show'); <--- 여긴 show-modal 써도됨
});
</script>