Sticky Nav, erst nach bestimmtem Element sticky

  • Hallo ihr,


    ich habe folgenden Code:


    HTML:

    und dazu folgendes css:



    Wenn ich jetzt möchte, dass die Navigation erst sticky wird, wenn ein bestimmtes Element (in diesem Fall das div) aus dem Bild scrollt, was muss ich dann ändern?

    Ich weiß ich könnte jetzt im script sagen okay, das div ist 500px hoch, mach das bitte ab 500px. Aber was, wenn ich sage width:100%; height:auto;? dann ist die Höhe ja immer wieder unterschiedlich... Brauch da quasi ein responsive workaround :)


    Danke schonmal!


    Liebe Grüße


    Sun

  • Ich verstehe das Beispiel leider nicht so ganz... ich kann Javascript hald leider überhaupt nicht...

    was müsste ich denn ändern?


    Danke auf jeden Fall schonmal für deine Antwort.

  • Ah Basti das Beispiel ist super danke !! Ich brauchs nur andersrum :P Also wenn ein bestimmtes Element nicht mehr sichtbar ist, dann muss die nav sichtbar sein :) und eben dann immer am oberen bildschirmrand fixed...

    Was müsste man da ändern? :)


    Sticky heißt für mich eigentlich, dass sobald ich an der navigation vorbei scrolle die Navigation am oberen bildschirmrand sich festsetzt und ab dann immer im vieport sichtbar ist.