Tutorial Floating Menü Bar

Floating Menü Bar


Zunächst ein dickes Dankeschön an Panda für die Vorstellung dieses Skriptes.

Guckt auch hier für zentrierte Seiten und hier für eine fest positionierte Navi mittels CSS im DIV-Container.

Ebenso kann man auch beliebig andere Objekte anstelle dessen mitscrollen lassen, wie z.B. dieses Bild.


Dieses Javascript scheint nicht mit der HTML-Ausgabe “XHTML” im Zusammenhang mit den Ausklappleisten der Navigation zu funktionieren. Bitte verwendet also einen anderen DOCTYPE als “XHTML”, falls Ihr die Ausklappleisten benötigt.
Ich habe mir im Master-Rahmen meiner Seite einen zusätzlichen, neuen Layout-Bereich aufgezogen. Dann legt Ihr Eure Navigationsleiste auf diesen neuen Layout-Bereich. Ebenso könntet Ihr das auch mit einer Tabelle machen.

Klickt bitte auf den neuen Layout-Bereich und im Fenster “Layout-Bereich-Eigenschaften” auf den Button “HTML”. Dort fügt Ihr dann “vor dem Tag” (ab NOF 11 “vorher”) folgenden Code ein, um diesem Layout-Bereich eine ID zu geben, auf die sich das Skript dann bezieht.

<div id="topbar">

... und zum Abschluss dieses Codes noch “nach dem Tag” (ab NOF 11 “nachher”):

</div>

... nun müsst Ihr lediglich das Skript (unten) in die HTML des Master-Rahmens kopieren (falls Ihr das nur auf einer einzelnen Seite anwenden wollt, dann in die HTML des Layouts).

> Master-Rahmen anklicken > Fenster “Master-Rahmen-Eigenschaften” > Button “HTML”

und das Skript unten “Zwischen Head Tags” einfügen. Bitte stellt noch die Ausgangs-Position der Nav-Bar ein. Bitte achtet darauf, dass Ihr die Y-Position nicht zu tief setzt, damit die Navi bei niedrigen Bildschirmen nicht am unteren Bildschirmrand verschwindet.

diese Seite weiter empfehlen



Counter Statistik