인프런 커뮤니티 질문&답변

Ji Young.님의 프로필 이미지

작성한 질문수

SCSS(SASS)+FLEX 실전 반응형 웹 프로젝트 with Figma

PC 레이아웃 상세 퍼블리싱 - 강의소개 05(네비게이션 부드럽게 스크롤링)

네비게이션 클릭시 헤더높이로 인해 제목 가리는 부분 해결방안

24.01.14 14:17 작성

·

221

·

수정됨

3

선생님, 안녕하세요:)

강의 유익하게 잘 보고 있습니다. 좋은 강의 해주셔서 몰랐던 부분을 정말 많이 알아갑니다!

 

'PC 레이아웃 상세 퍼블리싱 - 강의소개 05(네비게이션 부드럽게 스크롤링)' 강의에서 헤더 높이로 인해 제목 부분이 가려지는 문제를, 헤더 높이를 빼주면 해결되지 않을까 싶어 작성해보았습니다.

    /* Smooth Scrolling */
    var linkLocation = $(this).attr('href');
    $('html, body').animate({
      scrollTop: $(linkLocation).offset().top-'180' // <- 작성한 부분
    }, 500);
    e.preventDefault();

헤더 높이인 123px보다 더 많은 값인 180을 주니 제목이 가리지 않고 알맞게 스크롤되는데 이 방법이 맞는건지, 이렇게 했을 때 다른 문제가 발생하지 않는지 궁금하네요!

 

 

답변 1

0

코딩웍스(Coding Works)님의 프로필 이미지

2024. 01. 14. 16:20

제가 외부에 있어서 나중에 집에가서 테스트 해보겠습니다.

제가 JS 실력이 부족해서 강의 오픈하고도 이 부분이 항상 걸렸는데 정말 감사합니다.