fullpage.js 효과, 반응형 swiper, user-select

fullpage.js

: 스크롤 내리면 다음 섹션이 풀 페이지로 나오게 하는 것

main {
    overflow-y: scroll;
    height: 100vh;
    scroll-behavior: smooth;
    scroll-snap-type: y mandatory;
}

-> scroll-snap-type = 스크롤이 멈추면 어디에 맞출건지 설정
y mandatory = 세로 스크롤을 강제로 스냅포인트에 맞추는 설정

.section_group > .section {
    min-height: 100vh;
    border: 10px solid red;
    box-sizing: border-box;
    scroll-snap-align: start;
}

-> scroll snap을 시작점으로 맞춤

---

반응형 swiper

breakpoints: {
        0: {
            slidesPerView: 1
        },
        768: {
            slidesPerView: 2
        },
        1024: {
            slidesPerView: 3
        },
        1280: {
            slidesPerView: 4
        },
        1536: {
            slidesPerView: 5
        }

-> js에 설정할 수 있음

---

user-select: none;
-> 사용자가 드래그 못하게 막음