채택완료

자바스크립트 (제이쿼리) 마우스 휠 질문

제가 마우스 휠 할때마다 한 섹션씩 넘어가는 코드를 구글링해서 찾았습니다 

근데 이게 작동하는 방식이나 원리를 모르겠어서 혹시 해석? 풀이? 설명 해주실 수 있는 분 계실까요?

$(document).ready(function () {


    $('section').on('mousewheel', function (event, delte) {

        if (delte > 0) {
            var prev = $(this).prev().offset().top;
            $('html,body').stop().animate({
                scrollTop: prev
            }, 1000, 'swing');
        } else if (delte < 0) {
            var next = $(this).next().offset().top;
            $('html,body').stop().animate({
                scrollTop: next
            }, 1000, 'swing');
        }

    });
    
    }); //end

|

답변 3개 / 댓글 3개

채택된 답변
+20 포인트
2021-11-15 (월) 15:14:27

delte 가 아마 delta 그러니까 마우스 휠이 스크롤된 양일겁니다.

0 과 비교하는건 위로 굴렸냐, 아래로 굴렸냐를 판단해서

1초 후에 위로또는 아래로 가는 animate 효과를 주는거죠

답변에 대한 댓글 1개

2021-11-15 (월) 15:24:19

간단하게는 그냥 섹션에서 마우스 휠을 하면 그 다음 섹션의 위치를 파악해서 이동하는겁니다.

정확히 어디 부분을 모르시는지 콕 찝어주세요.

전체를 모르시면, JS, jQuery 공부를 먼저 해보세요.

https://homzzang.com/b/js-1390

https://homzzang.com/b/jquery

답변에 대한 댓글 2개

if(delta > 0 ) 이부분이 delta는 뭘 뜻하는 것이고 0은 뭔지 또는 뭔 기준인지 이것만 알면 될거같아요 !!
if(delta > 0 ) 이부분이 delta는 뭘 뜻하는 것이고 0은 뭔지 또는 뭔 기준인지 이것만 알면 될거같아요 !! 채택은 한분 밖에 못드려서 하트 드릴게요 ㅠㅠ

답변을 작성하려면 로그인이 필요합니다.