2010-12-21 3 views
1

Hey Jungs, ich ein wohl eher simpel Problem:CSS-Position Frage: Ebenen mit Z-Index?

meine Website hat zwei Schichten:

1) eine Drag & Drop-Navigation auf dem absoluten positioniert werden soll, so eine Rolle wirkt sich nicht auf die Riegel.

2) ein Inhaltsbereich hinter der Navigation, der scrollbar sein sollte.

können Sie sehen, was ich meine hier: http://jsfiddle.net/Pghqv/

aber jetzt kann ich nicht auf Links klicken in meinen Content-Bereich in den Rücken. irgendwelche ideen oder lösungen, wie kann ich immer noch das gleiche positionsergebnis haben und die links hinten funktionieren?

vielen Dank.

Antwort

0

In Ihrer Demo der einzige Grund, warum Sie nicht den Inhalt hinter dem Header klicken können, ist , weil es hinter dem Kopf#navigation div ist. Wenn Sie es von der Kopfzeile div mit margin-top: 200px; div verschieben, dann funktioniert es: JS fiddle demo.


Herausgegeben im Hinblick auf die Notwendigkeit, dass die Lösung dynamisch zu sein, und mit dem jQuery-Tag:

Wenn die Höhe des #navigation div nicht im Voraus bekannt ist, dann kann die folgende jQuery

$('#page-wrap').css('margin-top',$('#navigation').outerHeight()); 

JS Fiddle demo: statt einer konkreten css Deklaration im Stylesheet verwendet werden.

+0

was meinst du mit hinter dem Header? Ich habe nicht einmal einen Header. – matt

+0

@ user239831: ah, meine Entschuldigung: Ich meinte das 'div' mit einer' id' von 'navigation'. –

+0

oh yeah, aber gibt es keinen anderen Weg, um diese Arbeit zu machen. Meine Navigation ist dynamisch, also könnte es auch 1000px hoch sein. – matt