원페이지 스크롤 모바일 적용 채택완료
https://codepen.io/recordboy/pen/JBmvpp
pc에서 스크롤만 먹히고
반응형으로 모바일에서 쓰려고 하니 손으로 터치해서 움직이니 안 스크롤이 안되는데요.
//메인 원페이지 스크롤 var scroll = function(){ var $nav = null, $cnt = null, moveCnt = null, moveIndex = 0, moveCntTop = 0, winH = 0, time = false; // 새로 만든 변수
$(document).ready(function(){ init(); initEvent(); }); var init = function(){ $cnt = $("#main-wrap"); $nav = $(".scroll-nav a"); }; var initEvent = function(){ $("html ,body").scrollTop(0); winResize(); $(window).resize(function(){ winResize(); }); $nav.on("click", function(){ moveIndex = $(this).parent("li").index(); moving(moveIndex); return false; }); $cnt.on("mousewheel", function(e){ if(time === false){ // time 변수가 펄스일때만 휠 이벤트 실행 wheel(e); } }); }; var winResize = function(){ winH = $(window).height(); $cnt.children("div").height(winH); $("html ,body").scrollTop(moveIndex.scrollTop); }; var wheel = function(e){ if(e.originalEvent.wheelDelta < 0){ if(moveIndex < 3){ moveIndex += 1; moving(moveIndex); }; }else{ if(moveIndex > 0){ moveIndex -= 1; moving(moveIndex); }; }; }; var moving = function(index){ time = true // 휠 이벤트가 실행 동시에 true로 변경 moveCnt = $cnt.children("div").eq(index); moveCntTop = moveCnt.offset().top; $("html ,body").stop().animate({ scrollTop: moveCntTop }, 1000, function(){ time = false; // 휠 이벤트가 끝나면 false로 변경 }); $nav.parent("li").eq(index).addClass("on").siblings().removeClass("on"); }; };
scroll();
소스입니다. 어디를 수정하면 될까요?
답변 1개
답변을 작성하려면 로그인이 필요합니다.
로그인