Hide ion-header when scrolling

In one view I want to let the ion-header scroll with page. (so not stay fixed like normal). Or hide it when scrolling down which ever is easier.

Is this possible? I tried playing around with the position on ion-header but I can’t seem to get to it work since that of course overlaps the content.
image

So I do want to use the abilities of ion-navbar when the page hasn’t been scrolled on yet. But I don’t want ion-header to go of the image part if that makes sense.

https://yannbraga.com/2017/03/16/how-to-transparent-header-ionic2/