2012-12-05 2 views
-1

위쪽 또는 아래쪽 화살표를 클릭하여 항목 목록을 위아래로 스크롤 할 수있는 상자를 만들려고하지만 위쪽 화살표 나 아래쪽 화살표를 더 많이 클릭하면됩니다. 매우 빠른 속도로 스크롤 애니메이션의 응답 속도가 점차 느려지고 있습니다. 재귀 적으로 호출되는 것에 대해 읽은 적이 있습니다. 스크롤 효과의 응답 성을 높일 것이라고 생각합니다. 내 jquery를 볼 수 있고 성능 향상에 대한 조언을 해줄 수있는 사람이 있으면 좋겠다.Jquery 스크롤 효과가 더 많이 클릭하면 느려집니다.

$(window).load(function() { 
     $("#ScrollUp_Wrapper").mouseenter(function() { 
      $("#ScrollUp_Button").fadeIn("fast", function() { 
       $(this).css("filter", "progid:DXImageTransform.Microsoft.gradient(startColorstr='#F2F2F2', endColorstr='#E5E5E5')"), 
       $(this).css("background", "-webkit-gradient(linear, left top, left bottom, from(#F2F2F2), to(#E5E5E5))"), 
       $(this).css("background", "-moz-linear-gradient(top, #F2F2F2 , #E5E5E5)") 
       $("#ScrollUp_Button").mouseup(function() { 
        $("#AllPost_leftcol").animate({ scrollTop: $("#AllPost_leftcol").scrollTop() - 200 }, 500); 
         }); 
       }); 
      }).mouseleave(function() {$("#ScrollUp_Button").fadeOut("fast");}); 


     $("#ScrollDown_Wrapper").mouseenter(function() { 
      $("#ScrollDown_Button").fadeIn("fast", function() { 
        $(this).css("filter", "progid:DXImageTransform.Microsoft.gradient(startColorstr='#F2F2F2', endColorstr='#E5E5E5')"), 
        $(this).css("background", "-webkit-gradient(linear, left top, left bottom, from(#F2F2F2), to(#E5E5E5))"), 
        $(this).css("background", "-moz-linear-gradient(top, #F2F2F2 , #E5E5E5)") 
        $("#ScrollDown_Button").mouseup(function() { 
         $("#AllPost_leftcol").animate({ scrollTop: $("#AllPost_leftcol").scrollTop() + 200 }, 500); 
        }); 
        }); 
      }).mouseleave(function() {$("#ScrollDown_Button").fadeOut("fast"); 
     }); 

     }); 
+1

당신이 jsFiddle 예제를 만들 수 있습니까? – j08691

+0

'Jquery 스크롤 효과는 클릭 수가 많을수록 속도가 느려집니다. '. 아무 곳이나 클릭 이벤트가 표시되지 않습니다. 이 문제를 보여주는 jsFiddle이 최선의 방법 일 수 있습니다. – Nope

답변

0

사용이 :

$("#ScrollUp_Button").off('mouseup').mouseup(function() {...} 

그리고 ScrollDown 버튼에 대해 동일합니다.

원래 코드에서 래퍼를 입력 할 때마다 각 버튼에 대한 새 클릭 이벤트가 처리됩니다.

+0

스크롤을 제외하고 모든 것을 멈출 때 사용했습니다. 일관성없는 스크롤을 일으키는 원인이되었지만 문제를 완전히 해결하지는 못했지만, .off가 트릭을 완료 한 것으로 보입니다. 투표에 충분한 담당자가 없어서 고맙습니다. 내가 jsfiddle에 넣으려고했지만 스크롤 기능이 거기에서 일하고 싶지 않은 것 같다. 나는 왜 구문 검사기를 실행했는지 모르겠다. 그리고 당신이 그것을 체크하고 싶다면 여기 링크가 명확한 것처럼 보였다. 트릭을 완료했습니다. 링크 http://jsfiddle.net/RMEsh/12/ – AndrewBrntt

0

은 다음의 각 애니메이션 단계를 대기 전에 $.stop()를 호출하려고 :

$("#ScrollUp_Button").stop(true, true).fadeIn("fast", function() { 
... 
$("#AllPost_leftcol").stop(true, true).animate({ scrollTop: $("#AllPost_leftcol").scrollTop() - 200 }, 500); 
... 
$("#ScrollUp_Button").stop(true, true).fadeOut("fast"); 
... 
관련 문제