2010-05-26 7 views
1

내가 조금 내 웹 사이트에 애니메이션 jQuery를 사용하고 있습니다,하지만 난 어떤 행동에 약간의 문제에 봉착 :JQuery와 - 효과 + 자동 숨기기

내가 갑자기 상단에서 나타납니다 사업부를 가지고를 페이지와 쉐이크 :

$(minipopup).animate({ 
    marginTop: '+=' + (240) + 'px' 
}, 1000); 

$(minipopup).effect("shake"); 

이 미니 팝업, 그렇지 않으면 폐쇄에 대한 X를 가지고, 또는 것입니다 몇 초 후에 자동으로 가까이 :

setTimeout(function() { 
     $('#minipopup').effect("explode");   
        }, 10000); 

$('#closePopup').click(function() { 
     $('#minipopup').effect("explode"); 
        }); 

모두는 것을 제외하고, 작동 사용자가 클릭하면 CLOSE 버튼을 누르면 폭발 효과와 팝업 효과가 사라지지만 10 초 경과 후 (setTimeout에서 정의한 것) 사용자는 다시 팝업 폭발 (팝업 효과가 시각적으로 발생하지 않음)을 보게됩니다. 사용자가 이미 팝업을 수동으로 닫은 경우 어떻게 "유령"폭발을 피할 수 있습니까?

미리 감사드립니다.

답변

0

는이 같은, 약간 클릭 핸들러를 변경할 수 있습니다 : 당신이 다시 요소가 필요하지 않은 경우

$('#closePopup').click(function() { 
    $('#minipopup').effect("explode", function() { 
    $(this).remove(); 
    }); 
}); 

이 작동합니다. 다시 요소를 필요로하는 경우 영향을 단지에

또는, 당신의 setTimeout() 기능을 말할 경우 요소의이처럼 :visible selector를 사용하여 계속 표시 : 선택기가 일치 중지 다음 중 하나에

setTimeout(function() { 
    $('#minipopup:visible').effect("explode");   
}, 10000); 

을 더 이상 애니메이션을 적용하지 않으려는 요소.

+0

두 번째 대안은 나를 위해 완벽하게 작동했습니다. 많은 감사합니다. – lidermin

+0

@lidermin - 감사합니다. –

0

변수로 설정 setTimeout, 그래서 같은 :

var timer = setTimeout(function() { 
    $('#minipopup').effect("explode");   
       }, 10000); 

그리고, 당신의 클릭 이벤트에 시간 제한 취소 clearTimeout를 사용

$('#closePopup').click(function() { 
     $('#minipopup').effect("explode"); 
     clearTimeout(timer); 
        }); 
0

당신은 타이머를 클리어 할 필요를 때 사용자가 팝업을 닫습니다.

var timer =setTimeout(function() { 
     $('#minipopup').effect("explode");   
        }, 10000); 

$('#closePopup').click(function() { 
     clearTimeout(timer); 
     $('#minipopup').effect("explode"); 
        });