slideUp slideDown 애니메이션 오류

Question

div 위로 마우스를 올리면 두 번째 이미지가 위로 올라오고 마우스를 놓으면 슬라이드가 뒤로 움직이면서 애니메이션이 원하는 방식으로 정확하게 움직이지만 마우스를 너무 빨리 넣고 뺀다면 애니메이션은 버그를 끝내고 애니메이션을 떠난 높이로 이동합니다. 어떤 도움이에 일에 대해 서로 다른 블로그에서 찾고 정말 도움이 될 것입니다 그리고 난 수정을 찾을 수가 없어, 내가 프로토 타입 여기 sciptaculous를 사용하고있어 내 코드입니다 :

$('mid_about_us').observe('mouseenter',function() { 
$('about_us_mo').slideDown({duration: 0.5}); 
}); 
$('mid_about_us').observe('mouseleave',function() { 
$('about_us_mo').slideUp({duration: 0.5}); 
}); 

#about_us_mo{ 
position: absolute; 
float: left; 
bottom: 452px; 
left: 4px; 
z-index:99999; 
overflow: hidden; 

}

Answer 1

당신 Scriptaculous Effects Queue를 사용해야합니다.

이벤트가 발생하자마자 핸들러가 즉시 비동기 적으로 실행되므로 이벤트가 매우 빠르게 발생하면 핸들러가 겹쳐 충돌이 발생합니다. 당신이 정말로 원하는 것은 대기열에 줄을 서서 순차적으로 실행하는 것입니다.

여기에 대한 정말 좋은 기사입니다 :
http://script.aculo.us/docs/EffectQueues.html

귀하의 코드는 다음과 같이 표시됩니다

$('about_us_mo').slideDown({duration: 0.5, queue: 'end'}); 

당신은 할 수도 있습니다 서로 충돌하는 경우 여러 효과 큐를 만들 같은 것들. 이 기사는 모든 것을 설명하는 좋은 일을합니다.

HTH -Ken