스파르타코딩 내일배움캠프 DAY 14 TIL

developer.do·2022년 11월 18일
0

오늘은 마우스 스크롤을 하면 글씨를 커지게하는 기능을 만들어봤습니다.

역시 자바스크립트는 교과서 입니다.

자바스크립트를 배우면 배울수록, 정말 무궁무진하다는 생각이 드네요.

 스크롤 높이를 100까지 내리면 nav 글자를 줄여보기

      window.addEventListener("scroll", function () { <- 여기 안쓰면 페이지 로드시한번밖에 실행 안됨
        if (window.scrollY > 100) {   <- 스크롤양이 100 밑이라는 if 조건
          document.querySelector(".navbar-brand").style.fontSize = "18px";
        } else {
          document.querySelector(".navbar-brand").style.fontSize = "24px";
        }
      });

이렇게 한 번 사용법을 익혀보니, 어떤 상황에서도 손쉽게 만들 수 있겠더라구요.

window를 바탕으로 scroll 기능을 이해하고, 여기에 if문을 더해서 간단하게 만들어봤습니다만
정말 공부를 하면 할 수록 신기하다는 생각이 듭니다.

이제 이 배운것들을 멋지게 적용을 할 일만 남은 것 같습니다.

2개의 댓글

comment-user-thumbnail
2022년 11월 18일

오 신기하네요 ㅎㅎㅎ

1개의 답글