스크롤시 섹션(전체화면) 이동

/***********************  마우스 휠로 섹션 한 칸씩 이동 ****************************/
window.addEventListener("wheel", function(e){
    e.preventDefault();
},{passive : false});


const mHtml = $("html");
const cnt = 3;//섹션 개수
let page;
let pageOld;

let winHeight;
//mHtml.animate({scrollTop : 0},10); //새로고침시 최상단으로 이동
//페이지 이동시 스토리지 삭제는 별도 적용

// 새로고침시 스토리지에서 가져올 때
page = sessionStorage.getItem('page');
pageOld = sessionStorage.getItem('pageOld');



$('html,body').css('overflow','hidden');

$(window).on("wheel", function(e) {

    page ? '' : page=1; 
    pageOld ? '' : pageOld=1; 


	if(mHtml.is(":animated")) return;

	pageOld = page;
    if(e.originalEvent.deltaY > 0) {

        if(page == cnt+1) return;
        page++;

        if(pageOld==1 && page==2){
        winHeight = $(window).height()+150; // header 높이값 만큼 + 조절
        }else{
        winHeight = $(window).height()+50; // header 플로팅으로 인해 안맞는 부분만큼 조정
        }

    } else if(e.originalEvent.deltaY < 0) {

        if(page == 1) return;
        page--;

        if(pageOld==1 && page==2){
        winHeight = $(window).height()+150;
        }else{
        winHeight = $(window).height()+50;
        }
    }

    // 스토리지 저장할 때
    sessionStorage.setItem('page', page);
    sessionStorage.setItem('pageOld', pageOld);

    const posTop = (page-1) * winHeight;
    mHtml.animate({scrollTop : posTop},100);
})

/***********************  마우스 휠로 섹션 한 칸씩 이동 ****************************/

 

<header></header>
<div>section1</div>
<div>section2</div>
<div>section3</div>
<footer></footer>