Non-fixed header bar?

Is there a way to make a non-fixed header bar, i.e. it scrolls away/off-screen when you scroll down. It doesn’t seem as straightforward as overriding the position to not be absolute.

I also wanted a footer bar that is only visible when the header bar is visible (i.e. at the top of a list), and fades away otherwise.

I am seeing about whipping up a demo for you right now, and then making a little tutorial out of it. Give me an hour :slight_smile:

1 Like

Okay, I lied, it’s going to be a little tricker than I thought. However, I made some progress and should be able to get a tutorial up soon.

Hey @lwu, is this kind of what you were thinking? (do a search and make the example narrow and short to see):

Yea, the search bar is instead tied to the list/tiled content and scrolls up and away, which is the behavior I was looking for. I was actually thinking today about how to implement a search bar for a different part of the app…

I am looking to use clear header bars, but then when you scroll the buttons overlay white on white, so I need the header bar to scroll. Is there an easy way to do this?

unfortunately the plunkr doesn’t work anymore… nightly builds are not found (404)

I have done this with angular on desktop. Haven’t tried Ionic and mobile yet but will give it a shoot, unless someone else have done before me :wink:

Hi, does someone as an answer ?