nav-menu랑 nav-sub이 겹쳐서 나오는거 방금 깨달았네요. 헐..
게시판 이전 글 찾아보니 어떤 분도 같은 문제가 있더라구요. 쌤께서 답글 달아주신거 보고 코딩해봤는데요.
더 나은 방법은 없는지 궁금합니다.
1) 일단 ul에 padding-top을 넣어줬어요. margin-top을 넣었더니 nav-menu랑 nav-sub이 같이 밑으로 내려가더라구요.
<div class="nav-menu">
<h4 style="margin: 0" class="large-logo">Shirts Studio</h4>
<a id="products">Products</a>
</div>
<ul class="list-group nav-sub" style="padding-top:50px">
<li class="list-group-item">Outer</li>
<li class="list-group-item">Innerwear</li>
<li class="list-group-item">Shirts</li>
</ul>
2. padding-top 넣으니 nav-sub이 내려가긴 하는데 jumboron도 같이 내려가서 배경이 흰색이 되더라구요. nav-sub도 스크롤 아직 안내린 상태에선 font color가 흰색이라 글자가 안보여서 if 문 넣어줬어요.
$('#products').on('click', function(){
$('.nav-sub').slideToggle(function() {
if($('.nav-menu').css("color") == 'rgb(255, 255, 255)')
$('.nav-menu').css("color", "black");
else
$('.nav-menu').css("color", "white");
});
});
늘 숙제 내주시는거 하다보면 기능은 구현이 되긴 되는데 쓸데없이 길게 코딩하게 되어서 질문 드립니다.