Ion-nav-view with class parameter

ionic-v1
1

Hi

I have a design where my footer needs to be transparent to show the background image that spreads all over the screen.

i managed to do it by adding class parameter (with css image) to the ion-nav-view like this
ion-nav-view animation=“slide-left-right” class=“backGround-clouds”

and than my templates are basicaly ion-content directive and beneath it (out side of it) the ion-footer directive

i did this because if i place the class=“backGround-clouds” inside the ion-content , than the footer though is transparent , doesnt show the background image, but the default ionic background color.

my problem is that i have many different background images ,depending on the view.
how do i pass ion-nav-view class param , or what is the better way to do this

thanks

2

Maybe I’m not understanding you correctly, but you are saying you want to change the background image for each view while leaving the footer transparent so you can see this image behind it?

I messed around with a codepen for this, maybe this will help: http://codepen.io/anon/pen/wBJMVW

The ion-content is wrapped in an ion-view and I place the dynamic style on the view, then add styling to make the footer transparent (you can throw this in a class).

3

Hey the codepen looks exactly like what im trying to achieve
Ill try it a bit later
thanks

1 Like
4

I used the idea to wrap the ion-content with an ion-view and it works great

Thanks!!!

1 Like