Hide & Show Right Sidebar

Question

Also, ich versuche, ein Javascript oder eine Abfrage zu erstellen, um eine rechte Seitenleiste div zu verbergen. Es ist viel schwieriger, als ich erwartet habe, aber ich bin nah dran.

Ich habe eine rechte Seitenleiste erstellt, die beim Klicken ausgeblendet wird und dann wieder auf die volle Breite zurückgleitet, wenn auf die Schaltfläche erneut geklickt wird.

Problem: Wenn geklickt "Verbergen": Sidebar slide out 'Breite: 10px;' und der Inhalt als Rand rechts: 10px; Wenn "SHOW" geklickt wird: Sidebar schieben, um 'Breite: 200px;' und der Inhalt rutscht zurück zu 'margin-right: 200px;

Ich habe eine JS Fiddle zeigen erstellt:

http://jsfiddle.net/6uVvF/

Ich versuche, eine animierte Version von Gesicht Bücher rechten Seitenleiste zu erreichen. Hier ist auch ein anderes Beispiel: http://www.sidlee.com/

Danke.

Answer 1

So konnte ich einen gleitenden und verblassenden Effekt auf der Seitenleiste erstellen.

Es erlaubt mir, eine Sidebar zu verstecken. Ich lasse das Javascript jeden Gegenstand auf 0 animieren. Aber es funktioniert gut.

Siehe die Arbeitsversion hier:

http://jsfiddle.net/glepage/6uVvF/