• 로그인
  • 장바구니에 상품이 없습니다.

home2 게시판 JavaScript, TS 게시판 nav-menu랑 nav-sub이 겹치는 문제 (더 나은 방법은 없는지요)

nav-menu랑 nav-sub이 겹치는 문제 (더 나은 방법은 없는지요)

2 글 보임 - 1 에서 2 까지 (총 2 중에서)
  • 글쓴이
  • #18444

    박주연
    참가자

    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");          
            });        
      });  

    늘 숙제 내주시는거 하다보면 기능은 구현이 되긴 되는데 쓸데없이 길게 코딩하게 되어서 질문 드립니다.

    #18447

    codingapple
    키 마스터

    쓸데없는것은 아니고 그게 맞을 듯 합니다

    클릭했을 때 스타일을 바꿔야한다면 자바스크립트 넣기밖에 없습니다 

2 글 보임 - 1 에서 2 까지 (총 2 중에서)
  • 답변은 로그인 후 가능합니다.

About

현재 월 700명 신규수강중입니다.

  (09:00~20:00) 빠른 상담은 카톡 플러스친구 코딩애플 (링크)
  admin@codingapple.com
  이용약관
ⓒ Codingapple, 강의 예제, 영상 복제 금지
top

© Codingapple, All rights reserved. 슈퍼로켓 에듀케이션 / 서울특별시 강동구 고덕로 19길 30 / 사업자등록번호 : 212-26-14752 온라인 교육학원업 / 통신판매업신고번호 : 제 2017-서울강동-0002 호 / 개인정보관리자 : 박종흠