jquery 마우스 휠 이벤트

jquery 마우스 휠 이벤트

QA

jquery 마우스 휠 이벤트

본문

특정 부분만 fullpage.js 같은 효과가 필요해서

아래처럼 스크립트를 넣었는데요..

 


var win_h = $(window).innerHeight();
    $(".section.bnr").off().on("wheel touchmove  mousewheel DOMMouseScroll",function(e){
        e.preventDefault();
        e.stopPropagation(); 
        $(".section.bnr").each(function(index){
            $(this).attr("data-index",win_h * index);
        });
        var sectionPos = parseInt($(this).attr("data-index"));
        if(e.originalEvent.wheelDelta > 0 ||  e.originalEvent.detail < 0) { //up
            $("html, body").clearQueue().animate({scrollTop:sectionPos - win_h});
            return false;
        } else if (e.originalEvent.wheelDelta < 0 ||  e.originalEvent.detail > 0) { //down
            $("html, body").clearQueue().animate({scrollTop:sectionPos + win_h});
            return false;            
        }
    });


모바일에서 안되는 문제도 있고,

PC에선 잘 되는데 일부 맥북같은 노트북에서는 섹션별로 잘 멈춰지지가 않는 것 같아서ㅠㅠ...

뭔가 다른 방법이 있을까요..?

사이트에 스크롤 관련 다른 플러그인들이 있는데 충돌이 문제인건지..

도움주시면 감사드리겠습니다.ㅜㅜ

이 질문에 댓글 쓰기 :

답변 1

일부에서 동작된다고 하면 로직은 문제가 없는 것 같습니다.

 

그러나 브라우저별(모바일인지, 맥 OS인지)에 따라 해당 스크립트를 디버깅해  보시는 것을 추천드립니다.

 

모바일에서는 https://github.com/Tencent/vConsole  이것을 사용해서 디버깅해보세요.

 

웹페이지 앞에 <script src="https://unpkg.com/vconsole@3.9.1/dist/vconsole.min.js"></script> 를 추가 하면 됩니다.

 

https://sir.kr/so_jsframework/204

답변을 작성하시기 전에 로그인 해주세요.
전체 29
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT