Simpel gezegd heb ik 3 DIV's onder elkaar geplaatst. De header, een zoekbalk en de content. Scroll ik omhoog dan verdwijnen uiteraard de header en de zoekbalk en scroll ik door de content.
Nu zou ik eigenlijk graag willen dat de zoekbalk bovenin het scherm blijft staan.

Bijvoorbeeld bij Marktplaats werkt dat zo. Zodra de zoekbalk de bovenkant van het scherm raakt, krijgt hij de position fixed en blijft vervolgens staan, terwijl de content doorscrollt.

Ik heb er dagen op gezeten, maar het lukt mij niet de vinger er achter te krijgen.
Wie kan mij vertellen hoe je dat voor elkaar krijgt.
Hi Rob, bedankt voor je reactie.
Je oplossing werkt vast en zeker, maar ik heb zojuist ook een oplossing gevonden.
Voor de geïnteresseerden:
Ik heb de functie $(window).scroll(function() gebruikt en bepaal daarmee de positie van de scrollbar. In de gewenste positie, dus als de te fixeren DIV bovenaanstaat geef ik hem met de functie een .addclass. Die stelt de positie op 0px 0px en fixed. Is de positie van de scrollbar weer minder dan verwijder ik de addclass.
Werkt fantastisch.

Reageren