Jquery animate verstecken und zeigen

Question

Ich möchte zwei Dinge auf einmal passieren, wenn ich auf einen Link klicke. Ich gehe langsam durch Jquery-Dokumentation, muss aber noch lernen, was ich noch brauche. Hier

ist ein Link zu meinem site

Wenn ich auf die Dienste verknüpfe ich würde das #slideshow div verbergen mag, und ein neues div zu ersetzen.

Ich hatte versucht, die Slideshow einfach durch Klicken auf den Link Dienste zu animieren, aber es würde entweder die Animate-Funktion ausführen oder zur verknüpften HTML-Seite wechseln, nicht beides. Wie würde ich beides erreichen?

Es spielt keine Rolle, wenn ich nur divs auf der gleichen Seite verstecken oder anzeigen, oder wenn ich auf eine neue HTML-Seite gehe. Ich möchte nur die animierte Funktion haben und den Inhalt ändern, während ich einen verstecke.

dies ist der jQuery-Code I

$(document).ready(function(){ 
    $("a.home").toggle(
    function(){ 
     $("#slideshow").animate({ height: 'hide', opacity: 'hide' }, 'slow'); 
    }, 
    function(){ 
     $("#slideshow").animate({ height: 'show', opacity: 'show' }, 'slow'); 
    } 
); 
}); 

$(document).ready(function(){ 
    $("a.services").toggle(
    function(){ 
     $("#slideshow2").animate({ height: 'show', opacity: 'show' }, 'slow'); 
    }, 
    function(){ 
     $("#slideshow2").animate({ height: 'hide', opacity: 'hide' }, 'slow'); 
    } 
); 
}); 

Hause und Dienstleistungen sind die beiden Links verwende, und ich würde gerne Dienste beim Anklicken des #slideshow div, sich zu verstecken und die Slideshow2 div zeigen, was wäre, versteckt und dann den ersten ersetzen.

Es gibt eine beträchtliche Menge von HTML, so dass es einfacher sein kann, meine Quelle aus dem Link zu sehen.

Answer 1

Aktualisiert: Diese Lösung wurde nach einer Folgefrage in den Kommentaren aktualisiert.

Sie sollten die callback method der show/hide-Methoden verwenden.

$("a").click(function(){ 

    /* Hide First Div */ 
    $("#div1").hide("slow", function(){ 
    /* Replace First Div */ 
    $(this).replaceWith("<div>New Div!</div>"); 
    }); 

    /* Hide Second Div */ 
    $("#div2").hide("slow", function(){ 
    /* Replace Second Div */ 
    $(this).replaceWith("<div>New Div!</div>"); 
    }); 

    /* If you wanted to sequence these events, and only 
    hide/replace the second once the first has finished, 
    you would take the second hide/replace code-block 
    and run it within the callback method of the first 
    hide/replace codeblock. */ 

}); 

Die Callback-Methode ist der zweite Parameter der .show/.Hide Funktionen. Es wird ausgeführt, wenn die .show/.hide-Methode abgeschlossen ist. Daher können Sie Ihre Box schließen/öffnen und innerhalb der Callback-Methode sofort ein Ereignis ausführen.