2014-11-26 21 views
0

내 웹 사이트 (아직 공사중 - 도메인 이름을 잊어 버리고 광고 .. 일시적입니다) - http://davidsthilaire.comule.com 나는 부드러운 마우스 휠 스크롤을 가능하게하기 위해 이것을 사용했습니다. 나는이 코드 조각, 그리고 JQuery와-1.8.3.js 플러그인을 추가 한 이후 브라우저를 최소화 할 때(자바 스크립트) 부드럽게 스크롤 휠 마우스

<script> 
     jQuery.extend(jQuery.easing, { 
     easeOutQuint: function(x, t, b, c, d) { 
     return c * ((t = t/d - 1) * t * t * t * t + 1) + b; 
     } 
     }); 

     var wheel = false, 
     $docH = $(document).height() - $(window).height(), 
     $scrollTop = $(window).scrollTop(); 

     $(window).bind('scroll', function() { 
     if (wheel === false) { 
     $scrollTop = $(this).scrollTop(); 
     } 
     }); 
     $(document).bind('DOMMouseScroll mousewheel', function(e, delta) { 
     delta = delta || -e.originalEvent.detail/3 || e.originalEvent.wheelDelta/60; 
     wheel = true; 

     $scrollTop = Math.min($docH, Math.max(0, parseInt($scrollTop - delta * 50))); 
     $($.browser.webkit ? 'body' : 'html').stop().animate({ 
     scrollTop: $scrollTop + 'px' 
     }, 3000, 'easeOutQuint', function() { 
     wheel = false; 
     }); 
     return false; 
     }); 
    </script> 

그러나 지금, 나는 오른쪽으로 페이지 하단으로 스크롤 할 수없는거야 단지 조금 .. 그것은 완벽하게 모바일 장치에서 작동합니다. 나는 왜 그것이 데스크탑의 페이지 맨 아래로 직접 스크롤하지 않을지 전혀 모르겠다. 아무도 이것에 대한 수정을 알고 있습니까? 나는 고맙겠습니다.

+0

재생 될 때마다 깃발을 인상 .... 단지 나중에 다른 애니메이션이 1ms를 시작해서 또 다시 정지 기능을 사용하여 스크롤 액션 ... 많이 발사 부드러운 스크롤을 추가하지 마십시오. 브라우저에 이미 있습니다. – simonzack

+0

당신은 도메인 이름과 함께 손을 잡기 위해 동성애자가되기를 원하십니까? 아니면 machismo 버전에서 원하십니까? Machismo는 vanilla JS가 필요합니다 –

+0

LOL Nicholas, 제가 살펴 보겠습니다. 그리고 사이먼, 내가 아는 한 모질라는 이미 내장되어 있습니다. 크롬에는 확장 기능이 있어야합니다. 모든 사람이 확장 기능을 사용할 수있는 것은 아닙니다. 보시다시피 페이지에 시차 애니메이션이 있고 부드러운 마우스 휠 스크롤을 사용하면 시차 요소를 더 잘 전환하는 데 도움이됩니다 .. – David

답변

0

코드는 애니메이션이 여전히

if (animate) return; 

$($.browser.webkit ? 'body' : 'html').stop().animate({ 
    scrollTop: $scrollTop + 'px' 
}, 3000, 'easeOutQuint', function() 
{ 
    animate = false; 
    wheel = false; 
}); 
animate = true; 
관련 문제