jQuery를 사용자 지정 콘텐츠 스크롤의 애니메이션

Question

내가 현재 scrollTop을 얻을하고 다음 코드를 사용하여 특정 높이에 애니메이션을 만들 수 있어요 mCustomScollbar

로 스크롤하는 동안 애니메이션을 만들려고 노력 해요 :

$("#content").mCustomScrollbar({ 
    scrollButtons:{ 
     enable:true 
    }, 
     advanced:{ 
      updateOnContentResize: true, 
      updateOnBrowserResize: true, 
    }, 
    callbacks:{ 
     onScrollStart:function(){ onScrollStart(); }, 
     whileScrolling:function(){ WhileScrolling(); } 
    } 
}); 

function WhileScrolling(){ 
    var top = Math.abs(mcs.top); 

    if(top > 180){ 
     $('#topbar').animate({opacity:'0'}); 
    } 

한 번 추가

이

if(top < 180){ 
    $('#topbar').animate({opacity:'1'}); 
} 

이 부분이 실패하고는 animate({opacity:0}) SOM :하지만이 코드를 뒤쪽으로 애니메이션을 만들려고하면

ehow는 애니메이션을 시작하기 전에 오랜 시간이 걸립니다.

미리보기 :

http://www.alphadesigns.t15.org/

Answer 1

.animate()를 호출하기 전에 #topbar 애니메이션을 중지하십시오 :

여기에 jQuery를 .stop()에

$('#topbar').stop().animate({opacity:'1'}); 
$('#topbar').stop().animate({opacity:'0'}); 

더 : http://api.jquery.com/stop/