Home/ Questions/Q 8469485
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-10T16:14:30+00:00

I am doing a iPhone app using Phonegap & also using jquery mobile. I

  • 0

I am doing a iPhone app using Phonegap & also using jquery mobile. I want to set background image for data-role=page div. In this height of page is equal to screen & hence background is set to size of screen. But the page content length is much greater than screen & hence gray background is seen after image completes.
My question is whether there is a way so that we can keep the background image fixed & scroll or move only content of page & not background image.
Just to mention I have tried full size background jquery pluggin. Its working on Android but not on iOS.

Can anyone please help? Thanks in advance.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Ok, so what I did instead was to create a fixed element within the body element of the page.
    So it would look like

    <body>
   <div id="background"></div>
    ...
</body>

    And for the CSS I stated the following:

        #background {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: url(images/bg-retina.jpg) 0 0 no-repeat fixed !important;
    background-size:contain;
}

    And this did the trick for me. Hopefully it helps (someone out there :P)

    • 0