210410 JavaScript jQuery Swatch Scrollpage 풀이 (main_resolve.js)

$(document).ready(function() {
    
    // scroll 시 각 섹션에 맞는 li한테 스타일주기
    
    var winHeight = $(window).height();
    
    //마우스휠을 올렸을 때, -> 이전섹션으로
    //마우스휠을 내렸을 때  -> 다음섹션으로
        
    $(window).on("scroll", function() {
        var scr= $(this).scrollTop();
        
        for(i=0;i<4;i++){
            if(scr>=winHeight*i&&scr<winHeight*(i+1)){
               $(".gnb li").eq(i).addClass("on").siblings().removeClass("on");
            }
        }
        
    });
        
    $(".gnb li").on("click", function() {
        var i = $(this).index();
        $("html,body").stop().animate({
            "scrollTop": winHeight * i
        });
    });
    
    
    $("section").on("mousewheel", function(e,d) {
        var i = $(this).index();
        
        if(d>0){
            $("html,body").stop().animate({
                "scrollTop" : winHeight * (i-1)
            });
        } else if(d<0){
            $("html,body").stop().animate({
                "scrollTop" : winHeight * (i+1)
            });
        }
    });
    

    });