2009-10-21 2 views
0

을 중지JQuery와는 fadein 내가 스크립트 다음 한

내 기능은 내가 모든 버튼을 통해 마우스를 가져 및하지만 만약 버튼

의를 통해 문제를 마우스의 배경을 퇴색하는 것입니다

<script> 
    $(document).ready(function(){ 
    $("div.mover").hover(function() { 
    $("div.hide1").fadeTo("slow", 0.33); 

    $("div.hide1").fadeTo("slow", 1); 

},function(){ 
    $("div.hide1").stop(); 
}); 
    }); 
</script> 

and html page is 

<table width="100%" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td><div class="mover"><IMG SRC="images/buttons_full_01.png" ></div></td> 
</tr> 
<tr> 
<td><div class="mover"><IMG SRC="images/buttons_full_02.png"></div></td> 
</tr> 
<tr> 
<td><div class="mover"><IMG SRC="images/buttons_full_03.png"></div></td> 
</tr> 
</table> 

마우스 버튼을 떠난 후 애니메이션은 모든 거래가 완료 될 때까지 계속 유지됩니다.

내가 원하는 것 : 마우스 왼쪽 버튼 애니메이션은 $ ("div.hide1")이됩니다 .fadeTo ("slow", 1); 중지

답변

4

마우스 포인터가 두 번째 (또는 세 번째) "이동자"div 위로 드래그 아웃되지 않는 한 초기 함수는 정상적으로 작동합니다. 그렇게되면, 여러 애니메이션이처럼 대기가 나타날 수 있습니다 기본적으로

mover1.hover-over() 
mover2.hover-over() 

, stop를 호출하는 것은 오직 현재 애니메이션을 종료 - 첫 번째 이동기 시작한 애니메이션이 아닌 애니메이션은 두 번째 발동기 대기. 이 덕분에, 나를 미치게되었다

$(document).ready(function(){  
    $("div.mover").hover(function() { 
     $("div.hide1").fadeTo("slow", 0.33).fadeTo("slow", 1); 
    }, function(){ 
     // Added stop parameters and added an additional fadeTo, 
     // to make sure we get back to 100% opacity. 
     $("div.hide1").stop(true).fadeTo("slow", 1); 
    }); 
}); 
+0

대 답 :

당신은 선택적 매개 변수 clearQueue를 받아들이는 stop를 호출 애니메이션 대기열을 취소하여 실행 추가 애니메이션을 방지 할 수 있습니다. –

+2

때로는'stop (true, true)'가 실제로 필요합니다. – alexvance