How to keep background fixed between pages (ionic 2)

Ionic Framework ionic-v3
1

Hi everybody,

In my app, i need to keep background image fixed when user navigate between diferent pages.
When I push from page to page, I need the new page to just bring its content and have a transparent background.

What about this? Although I set the transparent background property of the second page, you see a white background. Then, by analyzing the code, I see that the previous page is added an attribute called [hidden] when I am in the new page, that makes it still see everything white, if I manually edit the html from the console and delete that attribute , You can see all the previous page with its content and above superimposed the new page.

I could use jquery, to remove the attribute, to hide elements, etc, but I do not want to do so.
Is there a way to be able to do this in a not so fancy way?

I need to achieve an effect as if a background was fixed and only the content that is inside would move, that each page only brings content and not background with it.

Thank you very much!!!

2

It sounds like to be what you need here is not two pages instead you can animate your content in the same page.

So you would actually have the two contents on the same page wrapped around some DIV. You can then Show & Hide as you wish and use some CSS animation to bring it in. I would be hesitant to touch the default navigation scheme of Ionic, to be honest.

Another way is to use a Modal that would come up and have a transparent background maybe. All ideas no real facts from ye just Ideas.

1 Like
3

It’s true, I could do it like this. I just focus on what they asked me and I did not think this alternative haha.
I could even use the default ionic slides for this now that I think about it and give them a transparent background, or something like that. I’ll see how I implement it.
Thank you!

4

Yes, so you can use the slides if it is not super heavy content. That’s the
approach aI would take actually as you have the transition already
provided.