Properly position a fixed background image on android?


#1

I am setting a fixed background image on the ion-content div. The position in Chrome, and on iOS it seems to position with respect to the viewport. But when I run the app on android (tested on 4.4.2), it seems to position the background image with respect to the content div. Has anyone else dealt with this? Any Suggestions?

I set a background image like this:
{background: url(…/my_image.svg);
background-attachment: fixed;
background-size: 160px;
background-position: 185px 428px;}

In my actual app these style properties are set using a directive, which looks at the screen size, so I am probably going to resort to using device.platform. That seems like an ugly hack that is likely to break at some point in the future. If anyone can help with a css solution I would appreciate it.


#2

Here are some pictures to demonstrate:

The black line is a fixed position div at “top: 478px”.
background-position: 100px 478px;


#3

Add this to your CSS

.tabs{
background-color:transparent;
}

#5

dont forgett the pixel ratio :S

U can change the position with the body class. The body become automatic the android class if it run on a android.