Ausführen nach der Cleartimeout-Funktion beendet (jQuery)

Question

Ich habe diese ituation. Ich habe eine setTimeout zu einer Funktion, in der ich ein Element ausgeblendet und eingeblendet habe. In einigen Sekunden wird diese Zeitüberschreitung mit cleartimeout gelöscht und gleich danach wird .hide() aufgerufen, um dieses Element auszublenden. Das Problem ist, dass manchmal das Element nicht versteckt wird. Ich habe das Gefühl, dass es etwas mit Timing zu tun hat.

Beispiel:

function first_func(){ 
    $('.element').fadeOut(function(){ 
     // Do other stuff like change element's position 
     $('.element').fadeIn(); 
    }); 

    interval1 = setTimeout(function(){first_func()},500);   
} 

function second_func(){ 
    countdown--; 
    if (countdown<0){ 
     last_func(); 
    } 
    interval2 = setTimeout(function(){second_func()},1000);   
} 

function begin_func(){ 
    first_func(); 
    second_func(); 
} 

function last_func(){ 
    clearTimeout(interval1); 
    clearTimeout(interval2); 
    $('.element').hide(); 
} 

Also im Grunde das Problem ist, dass in last_func ich beiden Intervalle lösche und das Element verbergen, aber manchmal ist das Element immer noch auf der Seite sichtbar. So dass ich vermute, es nicht zu verbergen, aber das Intervall ist noch im Gange und es verblasst wieder in.

Wenn jemand einen Vorschlag bitte

Answer 1

Nur ein Vorschlag, aber dieses Bit scheint mich falsch:

function second_func(){ 
    countdown--; 
    if (countdown<0){ 
     end_func(); 
    } 
    interval2 = setTimeout(function(){second_func()},1000);   
} 

Auch wenn Sie anrufen end_func() alles zu stoppen, sind Sie ein neues Timeout nach dieser Einstellung.

function second_func(){ 
    countdown--; 
    if (countdown<0){ 
     end_func(); 
    } else { 
     interval2 = setTimeout(second_func, 1000); 
    }  
} 

Noch ein Hinweis: Um zu vermeiden, dass die Ausführung fadeIn/fadeOuts das Versteck des Elements beeinflussen, sollten Sie die Animation Warteschlange löschen:

$('.element').stop(true, true).hide(); 

Answer 2

Sie scheinen hätte nie last_func zu nennen, ist end_func() sein soll letzte_func()?

Dies funktioniert: http://jsfiddle.net/CZ9hr/1/

Darf ich vorschlagen, einen einfacheren Ansatz für das, was Sie scheinen erreichen zu wollen: http://jsfiddle.net/fSEjR/2/

var countdown = 3, 
    $element = $('.element'); 

for (var i = 0; i < countdown; i++) { 
    $element.fadeOut().fadeIn(function() { 
     countdown--; 
     if (countdown === 0) $element.hide(); 
    }); 
}; 

Das funktioniert, weil Animationen automatisch in jquery Warteschlange.

Answer 3

Standardmäßig verwenden fadeIn und fadeOut eine Dauer von 400 Millisekunden, Sie können sie ändern, indem Sie den ersten Parameter einstellen.

$('.element').fadeOut([duration] [, callback]);