Search code examples
iphonecssiosios4

Workaround for 'background-attachment: fixed' which is not working in iOS4

I'm struggling to get web page with a fixed background image, so the image does not move when page is scrolled in a UIWebView.
What I've discovered is: background-attachment: fixed does not work in iOS4 (using 4.2.1). To double-check I've prepared a page with code snippet (below) inside <head> section and the page works as expected under Safari and Firefox on Mac, but fails to do so in iPhone's Safari...

What do you suggest as a workaround for achieving the expected results? I've made my UIWebView translucent and added UIImageView, so I can see "fixed background image" through translucent page. Unfortunately, I can see UIWebView borders when I scroll over its end/beginning edges.

Is there any official Apple resource/web page stating that background-attachment: fixed is not implemented for iOS4?

Cheers!

P.S. The code snippet referred above: 

<style type="text/css">  
body {  
    background: #ffffff url('image.jpg') fixed no-repeat;  
    background-attachment: fixed;  
}  
</style>
Solution

  • I am not sure what is going on with the CSS and have not had a chance to check it out for myself but I know when I was trying to get rid of the shadows from a UIWebView I used this bit of code:

    NSArray *sv = [NSArray arrayWithArray:[myWebView subviews]];
UIScrollView *webScroller = (UIScrollView *)[sv objectAtIndex:0];

NSArray *wsv = [NSArray arrayWithArray:[webScroller subviews]];

[[wsv objectAtIndex:6] setHidden:YES];
[[wsv objectAtIndex:7] setHidden:YES];
[[wsv objectAtIndex:8] setHidden:YES];
[[wsv objectAtIndex:9] setHidden:YES];

    and it got rid of the shadows. I thought I got the answer off of a SO question but when I looked for it this is the only one that came up.

    It passed App Store inspection.