Background-attachment: fixed not working on android/mobile

Question

I'm developing a cordova app and I'm trying to get a fixed background. Unfortunately, it doesn't seem to be working, and anytime I scroll down the background simply goes off the top of the page. Here's the CSS I'm using to do this (and I've tried it several other ways):

html {
    width:100%;
    height: 100%;
    background-color:#000000;
    background-image:url('../img/bg_reader.jpg');
    /*background-repeat:no-repeat;
    background-attachment: fixed;
    background-position: center;*/
    background-size: 100% 100%;
}

No matter what, the background scrolls off the top of the screen when I scroll down as if the fixed property weren't set.

Solution

Have you tried this?

    html, body {
        height: 100%;
    }
    html {
        overflow-y: hidden;
    }
    body {
        overflow-y: scroll;
        background-color:#000000;
        background-image:url('../img/bg_reader.jpg');
    }

Comments

[jozxyqk]

nice. it adds a scrollbar when not needed (maybe just in my case, not sure), but other than that works. I've added background-size: cover; to account for very large and portrait screens.

[B Rad C]

Dude, I did NOT think I would find a fix for this issue; thanks many.

[benallansmith]

Nice fix but the visible scroll bar at all times is a deal breaker for me.

[ruuter]

Be aware, that this solution will remove auto focus from page, which means you have to click the page before you can use mousewheel or keyboard buttons to scroll the page.