Ich versuche, die in jQuery integrierte Effektfunktionalität zu verwenden, um eine "Schublade" zu erstellen, die hinter einer Navigationsleiste herausgleitet und den Inhalt darunter aus dem Weg schiebt.

Wenn ich benutze$('#drawer').slideDown()wird der Inhalt aus dem Weg geschoben, aber der Inhalt "rutscht" tatsächlich nicht nach unten. Es ist eher ein Wischtuch, um den Inhalt zu enthüllen.

Wenn ich benutze$('#drawer').show('slide',{direction:'up'})wird der Inhalt korrekt nach unten verschoben, aber der gesamte Inhalt unter dem Element springt aus dem Weg, bevor der Effekt auftritt.

Gibt es eine Möglichkeit, das Beste aus beidem zu kombinieren, um den gewünschten Effekt zu reproduzieren: eine Schublade, die herausgleitet und den Inhalt darunter aus dem Weg schiebt?

Ich habe jQuery-Benutzeroberflächen untersucht.animate() Funktion, aber die Dokumentation ist nicht hilfreich. Meine groben Bemühungen, es zu nutzen, waren mit Misserfolgen behaftet.

Und für den Fall, dass jemand fragt, tut mir leid, ich kann kein Beispiel zeigen, aber wir möchten, dass es wie das jQuery Drawer-Plugin funktioniert:

http://lib.metatype.jp/jquery_drawer/sample.html

Aber dieses Plugin macht auch nicht das, was wir brauchen, sonst würde ich es nur benutzen (ohne Aufzählung oder AJAX-Inhalt). Der Effekt dort ist jedoch das, was wir wollen.

UPDATE: Ich habe diesen Teil des Codes auch über das jQuery Drawer-Plugin ausprobiert, aber es animiert überhaupt nicht:

$('#drawer').css({ marginTop: $('#drawer').height() * -1 }).animate({ marginTop: 0 });

Auch dies wird zur Verdeutlichung innerhalb einer Funktion aufgerufenOpenDrawer() das heißt so:

$(document).ready(function() {
    OpenDrawer();
});

Weil es standardmäßig geladen wird, wenn die Seite geladen wird.