2026, 새로운 도약을 시작합니다.

scrollTop 과 offset().top 관련 질문 채택완료

아래 코드는 제대로 실행이 안되고

Copy




     //헤더 색상이 변해야 하는 섹션

     //헤더 색상이 돌아와야 하는 섹션





    $(document).ready(function() {

        

        $(window).scroll(function() {

            var scrollTop = $(window).scrollTop();

            if (scrollTop >= $('.visual_part').offset().top) { //순서대로 색상 변해야 하는 섹션

                $('#header').addClass('white');

            } else if (scrollTop >= $('.creative_part').offset().top) { //순서대로 색상 돌아와야 하는 섹션(적용 안됨)

                $('#header').removeClass('white');

            } else {

                $('#header').removeClass('white');

            }

        })

    })



이 코드는 제가 원하는대로 노출되는 이유는 뭘까요?

좀 더 이 코드를 깔끔하게 정리할 수는 없을까요?

Copy




    

    





    $(document).ready(function() {

        

        $(window).scroll(function() {

            var scrollTop = $(window).scrollTop();

            if (scrollTop >= $('.creative_part').offset().top) { //제일 아래 섹션

                $('#header').removeClass('white');

            } else if (scrollTop >= $('.visual_part').offset().top) { //중간 섹션

                $('#header').addClass('white');

            } else {

                $('#header').removeClass('white');

            }

        })

    })



답변 1개

채택된 답변
+20 포인트

실행이 안된다면 F12 개발자 콘솔 열어서 콘솔탭의 에러를 보세요.

아래 코드는 딱히 최적화의 필요성을 못느끼겠습니다.

중복호출 하신다면 현 색션 상태를 변수에 담아두는것도 좋은 방법입니다.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인
🐛 버그신고