기분따라 코딩
  • 태그
  • 방명록
  • HTML
  • CSS
  • Javascript
  • React.js
  • Node.js
    • 분류 전체보기 (77)
      • HTML (8)
      • CSS (16)
      • Javascript (14)
      • React.js (11)
      • Node.js (7)
      • Python (4)
      • Database (2)
      • DevOps (1)
      • Log (2)
      • Info (6)
      • 정보처리기사 (6)
  • 메뉴 닫기
scroll event 검색 결과
1 개의 검색 결과가 있습니다.
Javascript

[웹 개발] 스크롤 방향 판별 및 스크롤 내릴 때에만 헤더 감추기

pageYOffset으로 스크롤 방향 판별하기 스크롤 방향 판별을 하기 위해 사용할 수 있는 여러 내장 프로퍼티들이 있지만 그중에 크로스 브라우징 문제가 없는 pageYOffset을 이용한 방법을 소개하겠습니다. 이것도 IE8이하에서는 작동하지 않지만, 저 정도의 구버전은 굳이 챙기지 않도록 하겠습니다. 먼저, 스크롤이 발생 중인 상태를 탐지하는 이벤트 리스너가 필요합니다. 이에 따라 필요한 이벤트는 "scroll" 입니다. 만들어야 하는 코드는 "scroll" 이벤트를 등록하는 이벤트 리스너와 이벤트가 발생할 때마다 호출될 이벤트 핸들러(콜백 함수)입니다. * 예시 코드 var prevScrollTop = 0; document.addEventListener("scroll", function(){ var..

2021. 10. 25. 08:00
  • «
  • 1
  • »

전체 카테고리

  • 분류 전체보기 77
    • HTML 8
    • CSS 16
    • Javascript 14
    • React.js 11
    • Node.js 7
    • Python 4
    • Database 2
    • DevOps 1
    • Log 2
    • Info 6
    • 정보처리기사 6

방문자

오늘
어제
전체
  • 최근 글
  • 최근 댓글

최근 글

최근댓글

태그

  • #Table
  • #Node.js
  • #react testing library
  • #만들기
  • #form
  • #Express
  • #요약 정리
  • #redux toolkit
  • #layout
  • #기출문제
  • #프로미스
  • #react
  • #로버트 C. 마틴
  • #javascript
  • #selector
  • #기초
  • #자바스크립트
  • #정보처리기사
  • #모듈
  • #태그
  • #필기
  • #웹개발
  • #웹소켓
  • #socket.io
  • #핵심
  • #개정판
  • #html
  • #레이아웃
  • #채팅 웹 만들기
  • #CSS
더보기+

블로그 인기글

Powered by Privatenote/라이프코리아 Copyright © 기분따라 코딩 All rights reserved. TistoryWhaleSkin3.4

티스토리툴바

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.