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

</p>

<p><div id="main_page">

    <div class="visual_part"></div> //헤더 색상이 변해야 하는 섹션

    <div class="creative_part"></div> //헤더 색상이 돌아와야 하는 섹션

</div>

<script>

    $(document).ready(function() {

        

        $(window).scroll(function() {

            var scrollTop = $(window).scrollTop();</p>

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

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

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

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

            } else {

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

            }

        })

    })

</script></p>

<p>

</p>

<p><div id="main_page">

    <div class="visual_part"></div>

    <div class="creative_part"></div>

</div>

<script>

    $(document).ready(function() {

        

        $(window).scroll(function() {

            var scrollTop = $(window).scrollTop();</p>

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

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

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

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

            } else {

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

            }

        })

    })

</script></p>

<p>