Slide- bzw. Sub-Menü verschiebt ganze Seite - soll sie aber nicht...

[houston]

Hallo Community!
Erst einmal ein herzliches Moin von mir. Ich bin neu hier und hoffe, dass ich bei euch Hilfe finde!

Zu meinem Problem:
Ich habe mit CSS (und Javascript) ein Submenü erstellt, dass sich vom Header aus nach unten hin öffnet. Leider verschiebt sich damit aber dann die ganze Seite. Das soll sie aber nicht. Der Inhalt im Contentbereich (weiße Fläche) und der Footer sollen so stehen bleiben.
Damit ihr genau wisst, was ich meine, hier einmal die Seite: http://www.last-smile.de/testseite/public.html

Wie schaffe ich es nun, dass sich das Menü so öffnet, wie es das jetzt zwar auch macht, sich allerdings nicht die restliche Seite bzw. der gesamte andere Inhalt nach unten verschiebt (auch der Scrollbalken soll demnach am rechten Rand verhindert werden)?

Ich würde mich sehr freuen, wenn ihr eine Lösung parat hättet oder Hilfe geben könntet!
Vielen Dank!

mfG,
houston

[pidd]

<div id="sub-link-bar" style="height: 0px; display: block; position: absolute;"></div>

allerdings lässt sich nicht wirklich erahnen wozu dein sub-link-bar Div da ist.
Grundsätzlich wenn sich etwas verschiebt dann liegt es daran, dass Div Container ihren Platz in anspruch nehmen bei Aktivierung. position: absolute; hilft hier meistens schon

[houston]

Danke für die schnelle Antwort.
Leider hilft dieser Zusatz nicht. Nun fährt das Submenü gar nicht mehr aus... Es soll dazu dienen, dort weitere Links oder eine eventuelle Anmeldung zu platzieren. Was gäbe es denn für eine andere Lösung? Müsste ich meine ganze Struktur ändern? Wenn ja, wie?

Danke weiterhin.
mfG

[pidd]

hm ich müsste vorallem wissen wie du das Submenu anordnen möchtest. Sollen die Sublinks dann untereinander in einer Liste stehen oder nebeneinander?

[houston]

Letztendlich soll es ein Menü sein, in dem man sich z.B. als Nutzer anmelden oder Einstellungen bearbeiten kann. Je nach Link, den man anklickt, sollen demnach verschiedene Möglichkeiten gegeben sein. Geht es denn überhaupt, dass das Submenü nur soweit ausfährt, wie auch Inhalt dann gegeben ist? Immerhin habe ich ja dann jedes Mal verschiedenen Inhalt...

[pidd]

hast du vielleicht ein genaues beispiel?! also ein bereits fertiges?? dann kann ich dir vermutlich besser helfen

[threadi]

Wie schaffe ich es nun, dass sich das Menü so öffnet, wie es das jetzt zwar auch macht, sich allerdings nicht die restliche Seite bzw. der gesamte andere Inhalt nach unten verschiebt (auch der Scrollbalken soll demnach am rechten Rand verhindert werden)?

Den Scrollbalken sollte man immer einblenden. Dann wird es auch in jedem Browser einheitlich dargestellt. Hast Du den nicht würde die Seite z.B. im Firefox hin- und herspringen wenn mal eine Seite mit weniger und dann mit mehr Inhalten aufgerufen wird.

Unabhängig davon ..

allerdings lässt sich nicht wirklich erahnen wozu dein sub-link-bar Div da ist.

... wäre das hier auch mal hilfreich. Trage in dieses div Inhalte ein damit man überhaupt erkennen kann was du beabsichtigst.

[houston]

Ein bereits fertiges Beispiel habe ich leider nicht. Das würde die Sache glaube ich auch erheblich vereinfachen

Aber ich habe mal auf die Schnelle 2 Screens gebastelt, die das Problem sicherlich genau erklären sollten (Bilder sagen mehr als tausend Worte und so...).

Erste Screen zeigt die Ausgangsstellung:
http://www.last-smile.de/testseite/testansicht.jpg

Zweiter Screen zeigt den ausgefahrenen Banner mit Inhalt, wie es sein sollte, nachdem auf den Link "Konto erstellen" geklickt wurde:
http://www.last-smile.de/testseite/t...istrierung.jpg

Danke für die Hilfe!

mfG

[pidd]

ahhh jetzt verstehe ich hab nicht verstanden was das mit einem menu zu tun haben sollte aber gut,.. also meiner ansicht nach bleiben dir hier nur zwei möglichkeiten entweder du findest dich damit ab dass es alles nach unten verschiebt oder du baust es um möglicherweise mit einem overflow oder etwas derartigem.
Dein Problem hier ist nämlich dass dein Div (sub-link-bar) per display: none; ausgeblendet wird. Der div wird also, solang das submenu nicht aktiv ist, "gelöscht". Sobald das nun eingeblendet wird, schafft sich der Divcontainer den nötigen Platz und verschiebt alles nach unten.
Rein logisch kannst du den Platz allerdings schon "reservieren" d.h. deinem Div (sub-link-bar) schon die nötige höhe geben die er im ausgeklappen zustand hat, anschließend per CSS ausblenden und nicht "löschen" und zwar mit visability: hidden; im aktiven zustand dann visability: visible; versuch dass doch mal

EDIT: selbstverständlich kannst du es auch noch mit anderen methoden probieren das hier alles aufzulisten und zu erklären würde aber einiges an zeit beanspruchen :S

[houston]

Hallo!
Vielen Dank für deine Hilfe und Tipps. Ich habe es nun etwas anders gelöst. Aber du hattest vollkommen recht, dass es Probleme mit dem Div-Tags gab.
Hier ist meine Lösung (Code darf natürlich eingesehen und gerne auch benutzt werden, falls jmd. es benutzen möchte ): http://www.last-smile.de/testseite/public.html

Schönen Sonntag noch!
mfG