[jQuery 활용하기] 04. 프로젝트: 나만의 포트폴리오

포트폴리오 I: 메뉴 색 바꾸기

 

첫 번째로 메뉴의 폰트 색상을 바꿔봅시다.

포트폴리오 사이트에는 섹션이 세 개 있습니다.

1. 'header' 섹션
2. 'about' 섹션
3. 'contact' 섹션

'header' 섹션에 있을 때는 네비게이션바의 메뉴가 흰색으로 설정되어 있는데요. 'about' 섹션과 'contact' 섹션으로 이동하면 메뉴가 잘 보이도록 폰트 색상이 #4A4A4A로 바꿔주세요.

---

function scrollHandler() {
    if ($(window).scrollTop() >= $('.about').position().top) {
        $('.menu-right button').css('color', '#4a4a4a');
    } else {
        $('.menu-right button').css('color', 'white')
    }
}

$(window).on('scroll', scrollHandler);

scrollHandler();

---

본 내용은 Codeit의  'jQuery' 강의를
참고하여 작성한 내용입니다.