Here’s what I’m after: a nav menu that is not at the top of the window until the user scrolls down the page, then it stays at the top of the window until the user scrolls all the way back up to the top of the page again.
Thanks for that, David. I think there’s a way to do what I’m after with CSS, but I’m not sure. Does anyone know if this is a possibility?
I want a nav menu that sticks to the top (backdraft has one and the Softpress home page too) but starts out a couple 100 px below the top, until the user scrolls down.
There is a new feature in the latest browsers called position: sticky, but it is only supported in the very very newest browsers. That will work in CSS alone, albeit only for the hipsters.
Sticker is designed to produce the effect you describe, and I am willing to bet that if you apply it on an otherwise empty page to an HTML element, it will stick and un-stick the way you desire. If you don’t include jQuery on your page, you may have to find a Prototype way to do the same thing (which is not usually hard).
Walter
On May 20, 2015, at 6:08 PM, Doty email@hidden wrote:
Thanks for that, David. I think there’s a way to do what I’m after with CSS, but I’m not sure. Does anyone know if this is a possibility?
I want a nav menu that sticks to the top (backdraft has one and the Softpress home page too) but starts out a couple 100 px below the top, until the user scrolls down.
I wish there were an alternative. More slideshows need to be added to this site in the future, so this seems to be a dead end. My first priority is to keep the site responsive, including the sliders.
Ahh, so there might be a way! I know I don’t want to redo the slider. It is working for the responsive features I need and the client likes the look of it. So, where could I look to find a sticky nav bar? The slider is jQuery. So that means I need to find a jQuery sticky nav bar, right???
I found this link via the old FWTalk archives from you David! It makes me think Walter’s script could be done via jQuery. Perhaps it’s done via markup item and not an action?
All is well with this, except my google map on my contact page. When you scroll down the map appears on top of the navigation menu. I’ve tried adding a z-index to the nav menu, but nothing changed. Ideas?