안녕하세요 선생님 강의 잘 듣고 있습니다.
'스크롤 애니메이션 2 : 스크롤시 변하는 Navbar 숙제' 강의에서 질문있습니다.
<div class="nav-menu" >
<h4 style="margin: 0" class="large-logo">Shirts Studio</h4>
<a id="nav-sub-button">Products</a>
</div>
(제가 쓴 것)
<script>
$(window).on('scroll', function(){
if( $(window).scrollTop() > 100) {
$('.nav-menu').addClass('nav-black');
$('.large-logo').addClass('small-logo');
}
});
</script>
(강의 내용)
<script>
$(window).on('scroll', function(){
if( $(window).scrollTop() > 100) {
$('.nav-menu').addClass('nav-black');
$('.nav-menu h4').addClass('small-logo');
}
});
</script>
스크롤 내렸을 때 Navbar 사이즈가 작아지는 애니메이션에서요
$('.nav-menu h4')에 addClass를 작성하셨는데요.
저는 $('')안에는 클래스명이 들어가기 때문에 <h4>태그의 클래스명인 large-logo를 작성하였고, 정상적으로 작동도 되었습니다.
눈에 보여지는 것으론 둘의 차이가 없는데,
그렇다면
$('.large-logo').addClass('small-logo');
$('.nav-menu h4').addClass('small-logo');
의 차이가 있는지 궁금합니다. <h4>의 클래스명은 두개가 되는 건가요?
만약 차이가 없다면 <h4>태그에 large-logo라는 클래스명을 굳이 추가할 필요가 없어보이는데
UI시작페이지의 글씨크기를 css로 크게 설정하기 위해서 large-logo라는 클래스명을 추가하신건지 궁금합니다.
