일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 | 29 |
30 | 31 |
- JavaScript
- 자바스크립트
- 네트워킹
- Algorithm
- 이벤트
- 자바
- 데이터통신
- 연습문제
- pulsesecurevpn
- 라이브러리
- quizlet
- ai select
- 단어장
- gsap
- JLPT
- 초연결 사회의 데이터통신과 네트워킹
- 갤럭시북5
- html
- 스크롤
- 함수
- 한빛아카데미
- java
- 일본어
- ArrayList
- Node.js
- React
- pulsesecure
- 알고리즘
- vpn 에러
- 백준
- Today
- Total
목록스크롤 (2)
umilove98의 블로그

웹 페이지를 보다보면 맨 위로 스크롤 해주는 버튼이 아래쪽에 위치해 있는 것을 볼 수 있다. 이를 편하게 구현할 수 있게 해 주는 라이브러리 gsap의 ScrollToPlugin이 있다. gsap - Libraries - cdnjs - The #1 free and open source CDN built to make life easier for developers gsap - Libraries - cdnjs - The #1 free and open source CDN built to make life easier for developers GSAP is a JavaScript library for building high-performance animations that work in **every** ..

화면이 스크롤되어 일정 위치에 도달하면 요소를 보이지 않게 하고 싶다. window.scrollY 속성을 이용하면 문서가 수직으로 얼마나 스크롤됐는지 픽셀 단위로 반환해준다. window.addEventListener( 'scroll', _.throttle(function () { console.log(window.scrollY); if (window.scrollY > 500) { // 배지 숨기기 badgeEl.style.display = 'none'; } else { // 배지 보이기 badgeEl.style.display = 'block'; } }, 300) ); lodash.js를 사용하였다. 화면을 스크롤하면 300ms 간격으로 문서가 수직으로 스크롤 된 크기를 콘솔에 출력하고 500px 넘게 ..