테슬라 홈페이지 클론코딩

hyocho·2022년 10월 21일
1

토이프로젝트

목록 보기
3/7
post-thumbnail

야심차게 시작한 클론코딩인데, scroll 구현이 안됐다.
강의의 문제인듯 했던게 유투브 댓글 단 사람들도 모두 안된다고...
fullpage scroll 을 구글링하면 css로도 구현되는 것이 있긴 했지만 js 랑은 조금 다른 맛(?) 이었다.
곧 실력을 더 키워서 혼자 힘으로 해결할 수 있길 바라며 비록 실패작이지만 기록을 남겨둬본다.

👩🏻‍💻

  1. Window.pageYOffset
    ScrollY의 오래된 이름. IE환경을 생각하지 않는다면 ScrollY를 써도 무방하다.

  2. scroll

window.addEventListener('scroll', () => { 
  //스크롤 발생 시에 현재 스크롤 위치(X,Y)가 console.log에 찍힌다.
  console.log(window.scrollX, window.scrollY);
});
  1. offsetTop
    offsetTop 속성은 요소의 Y축 위치 값(문서 기준)을 가져온다.

  2. array.forEach(function(currentValue, index, arr), thisValue)
    Array 객체에서만 사용가능한 메서드
    배열의 요소들을 반복하여 작업을 수행할수 있다.
    인수는 차례로 배열의 각각의 item, index, 배열 그 자체.

유튜브 강의 주소
git hub 주소

profile
기록하는 습관을 기르고 있습니다.

5개의 댓글

comment-user-thumbnail
2022년 10월 24일

안녕하세요!!
이번에 메가바이트 스쿨 프론트엔드과정에 지원했는데 여쭤볼 게 있습니다.
1. 지원절차 마지막에 AI면접이 있던데 어떤 질문이 있는지 알 수 있을까요??
2. 제가 코린이라 수업내용을 못 따라갈까 봐 걱정인데.. hyocho님은 만약 그날 수업내용이 어려워서 이해를 못 했을 경우 어떻게 공부하고 있는지 궁금합니다. 그리고 강사님께서 어떻게 교육하시고 계신지 교육방식이 궁금합니다.
3. 홈페이지에 커리큘럼이 나와있지만 기간은 안 나와있어서 기간을 알 수 있을까요?? (ex. 1주 차 무엇을 배우는지 2주 차에는 무엇을 배우는지)
수업 들으시느라 바쁘실 텐데 정말정말 죄송합니다...

1개의 답글
comment-user-thumbnail
2022년 10월 24일

아닠ㅋㅋ "스크롤 안되는 테슬라 홈페이지" 너무 웃기네용

1개의 답글