Header image with transparent navigation bar

ionic-v1
1

Hi, I have experimented a little with Ionic the recent days. Now I have encountered a problem when trying to display a header image with a transparent navigation bar on top.

What I want to do:

i4e3wn.png318×512

Have managed to get it like this in the browser and the Phonegap app with the " ionic serve" command:

2zsz2n9.png319×502

But when I test it on iOS simulator it looks like this = the navigation bar is back:

jz6yhv.png481×720

Does anyone have know what I do wrong by looking on these images? Otherwise tell me and I post more details/code.

1 Like
2

How you solved the issue?

Thanks.

3

hi, the nav-bar on device got solved when I updated Ionic. beta-14
I made a Codepen to get header image with transparent nav-bar, does this answer your question?

<ion-nav-bar class="bar-clear">
<ion-content style="top:0;">
2 Likes
4

Yes. Thanks for the solution.