Probleme mit Sticky Navigation

1. offizieller Beitrag

    Hey zusammen,

    ich habe mal eine sticky navigation versucht zu erstellen. Jedoch fxiert sich die navigation nicht. Ich habe heute etwas begonnen jquery zu lernen (anhand der sticky navigation) aber ich weiß nicht warum das nicht klappt.

    Anbei meine codeschnipsel :

    Freue mich auf eure Hilfe.

    Gruß,
    Stef

    • Offizieller Beitrag

    Du verwendest jQuery-Selektoren, bindest dies aber nirgendwo ein.
    Falls das Dein einziger Anwendungsfall ist, benötigst Du das auch nicht wirklich. Du beachtest allerdings auch die Priorität von CSS-Regeln nicht. Wenn Du einem Element grundlegend über eine ID Eigenschaften zuweist, sind die nicht durch eine Klasse ohne weiteres überschreibbar. Die ID hat eine höhere Priorität!

    Du kannst Deinem <nav> eine Klasse geben:


    und müsstest Deine CSS dahingehend anpassen:


    Dann ist das mit reinem JavaScript problemlos machbar:

    Hey,

    ich möchte das wenn man runterscrollt, und der header nichtmehr sichtbar ist, das die navigation erst den fixed zustand bekommt und dann mitgeht.

    Jetzt geht die navigation aber nicht mit. Das soll ja nicht sein.

    Wie kann man es denn machen ?

    Stef

    • Offizieller Beitrag
    Zitat

    ich möchte das wenn man runterscrollt, und der header nichtmehr sichtbar ist, das die navigation erst den fixed zustand bekommt und dann mitgeht.


    Das übersteigt meine Verständniskraft... :shock:
    Wenn der User soweit scrollt, dass der Header nicht mehr sichtbar ist, soll die Navigation fixed sein und dann ( wann genau ??? ) doch wieder mitgehen :confused:

    Entweder, ich will ein Element fixed haben oder nicht!
    Den Fall, dass dies erst ab einer bestimmten Scrollposition so sein soll, kann ich geistig noch verarbeiten.
    Aber dann wieder doch mitscrollen?! Kein Plan, was Du wirklich willst...

    Sorry

    Ich möchte nicht einfach den code kopieren möchte es mal selbst machen und was lernen dabei. Wenn man einfach alles kopiert lernt man ja nix.

    Bei mir funktioniert das aber nicht. Hier das Bild : http://prntscr.com/cjoozj , das weiße ist die nav und die geht aber nicht mit

    EDIT: Funktioniert jetzt.

    Einmal editiert, zuletzt von Stef (19. September 2016 um 15:02)