https://lenis.darkroom.engineering/
Lenis๋ฅผ ์ด์ฉํ์ฌ ํฌํธํด๋ฆฌ์ค์ ๋ถ๋๋ฌ์ด ์ ์ฒด ์คํฌ๋กค์ ์ค์นํด๋ณด์.
- ๋ถ๋๋ฝ๊ณ , ์พ์ ํ ๊ฒฝํ์ ์ ๊ณต
- ์๊ฐ์ ์ธ ์ธ์์ ํฅ์์ํจ๋ค.
์ค์น ๋ฐฉ๋ฒ์ ๊ต์ฅํ ์ฌํํ๋ค.
1. ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ค์น
npm i lenis
2. ๊ด๋ จ ์ฝ๋๋ฅผ ๋ฉ์ธ์ ๋ฃ๊ธฐ
const lenis = new Lenis()
function raf(time) {
lenis.raf(time)
requestAnimationFrame(raf)
}
requestAnimationFrame(raf)
์์ฆ ์์์ผ๋ก ๊ฐ๋ฐ ๊ณต๋ถํ๊ณ ์๋๋ฐ, ๋ง์ฐํ ์ฝ๋ ๊ฒ๋ณด๋ค ํ์คํ ํจ๊ณผ๊ฐ ์ข๋ค. ๋์ ํ์ด ๋ง๋ ์ ์๋์ ์ฐพ๋ ๊ฒ์ด ์ค์ํ๋ค.
์์ + ์ฝ๊ธฐ + ํ๋ก์ ํธ ๊ฒฝํ์ ์ ๋ฒ๋ฌด๋ฆฌ๋ฉฐ ํด๋๊ฐ๋ ๊ฒ์ด ์ค์ํ๋ค.
์น์ฐ์น์ง ์๊ณ ๊พธ์คํ
classnames ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ์ฌ์ฉํ์ฌ ๋์ class ์ถ๊ฐํ๊ธฐ (1) | 2024.06.14 |
---|---|
๋ฆฌ์กํธ์์ Google Maps API(๊ตฌ๊ธ๋งต API) ์ฌ์ฉํ๊ธฐ(+ ์ปค์คํ ๋ง์ปค) (0) | 2024.05.10 |
[0418] ํด๋ ์์ , useEffect ๋จ์ฉ ์๊ธฐ (0) | 2024.04.18 |
0413 React-query ๊ณต๋ถ (0) | 2024.04.13 |
[React] Todo List ๋ง๋ค๊ธฐ(CRUD ๊ธฐ๋ณธ ๊ฐ๋ ) (0) | 2024.03.23 |