jQuery page slide Menü

[m-ortloff]

Guten Tag,

ich habe eine Website bei der ich überall für die einzelnen Seiten als Breite 100% angegeben habe,
nun möchte ich bei einem .click() event auf einen Button das sich ein Menü an der linken Seite einblendet und den kompletten Rest der Seite nach rechts verschiebt.
Bei wiederholten klick soll sich dann das Menü wieder nach links ausblenden und die Seite soll sich wieder an der ursprünglichen Position befinden.

Vielen Dank im vorraus.
Marius Ortoff

 

[Tronjer]

Ist an sich ganz einfach. Baue erst mal zwei HTML-Elemente - #menu und #content - gib ihnen width und height, lege einen border drum und floate beide. Im nächsten Schritt gibst du #menu per CSS ein display: none. Damit verschwindet es, und #content rückt nach links. Andließend erstellst du innerhalb #content einen Button und belegst diesen mit dem Click-Event.

$('button').on('click', function() {
    $('#menu').toggle();
})

Falls du einen easing-effekt willst, bieten sich noch slideToggle() oder animate() an.