Website: Navigation nur vertikal fixieren (JavaScript?)

L

LNB

Guest
Hi,

ich bin dabei mit HTML und CSS eine Website zu schreiben, die links die Navigation und rechts den eigentlichen Inhalt hat. Die Navigation soll sich beim horizontalen Scrollen mitbewegen, beim Vertikalen allerdings an der linken Seite bleiben. Würde man hier "position:fixed" benutzen, würde die Navigation zwar vertikal mitscrollen, allerdings horizontal auch. Dadurch würde immer ein Teil vom Inhalt abgeschnitten werden. Im Internet bin ich bisher immer nur auf den Hinweis gestoßen, dass dies nur mit CSS nicht zu realisieren wäre. Aber mit JavaScript sehr wohl. Kann mir wer den Codeschnipsel dazu mal posten? Im Netz habe ich dazu nichts brauchbares gefunden oder nicht verstanden, da ich mich noch nicht groß mit JS auseinander gesetzt habe. Danke.
 
Wenn Du diese Anzeige nicht sehen willst, registriere Dich und/oder logge Dich ein.
Hallo LNB,

eine kurze Suche bei Google hätte folgendes Ergebniss geliefert:

jquery - Div that follows scroll (not position:fixed) - Stack Overflow


Also:
jQuery und das Plugin einbinden

Code:
$(document).ready(function() {
    $('#sidebar').scrollToFixed({ marginTop: 10 });
});

Und wir haben eine Sidebar, die nur beim vertikalen Scrollen "mitgeht".
Falls gwünscht, kann man auch marginTop auf 0 einstellen, damit die Sidebar immer am oberen Rand ist!


Mit freundlichen Grüßen,
HowUpDoHighKnee
 
Hallo LNB ,

du musst dabei aber bedenken wenn jemand JavaScript deaktiviert hat funktioniert es nicht .... deswegen alles mit html und php funktionsfähig machen und dann mit JS verfeinern ;)
 
CSS ist ausgeschöpft und PHP kann sowas garnicht. JS verfeinert folglich die "user experience" deutlich und wenn ein Besucher javascript deaktiviert hat, dann hat er eben Pech gehabt. Dieses Forum funktioniert für euch ja auch nur so, weil viel einfach in javascript läuft. Javascript ist übrigens nicht Java. ;)
 
Hardwareluxx setzt keine externen Werbe- und Tracking-Cookies ein. Auf unserer Webseite finden Sie nur noch Cookies nach berechtigtem Interesse (Art. 6 Abs. 1 Satz 1 lit. f DSGVO) oder eigene funktionelle Cookies. Durch die Nutzung unserer Webseite erklären Sie sich damit einverstanden, dass wir diese Cookies setzen. Mehr Informationen und Möglichkeiten zur Einstellung unserer Cookies finden Sie in unserer Datenschutzerklärung.


Zurück
Oben Unten refresh