iOS Background Images Invisible.

[Noel Forte]

Hey-

I first discovered this when testing some stuff out for my own website, but it seems that some versions of iOS don’t display large background-image‘s (large in dimensions, not in size). When this happens, the background image is simply ignored and rendered as transparent, as if it were never there.

After doing some tests, I found that my iPod touch (running iOS 6.1.6), can’t display anything larger than 1800 pixels (in any dimension). When I tested the same page on an iPhone 5, the background image became visible.

Does anyone know why this effect occurs? I’m stumped.

Thanks,

Noel

[Paulie_D]

Perhaps you could share the link.

Are you using media queries, I believe there was an issue with those not registering correctly in IOS?

[Noel Forte]

No, there aren’t any media queries.

I’ve set up a reduced test case for demoing this issue: http://jsfiddle.net/h9KgD/16/

Here is what the result box looks like on my iPod Touch: https://app.box.com/s/6mxftalpnxov6j4f0aiv

Notice that the 1000px image is rendered, but the 2000px image isn’t visible.

[Noel Forte]

@TheDoc Thank you! I had done a bit of research on this, but wanted to be sure what the exact limitations were.

Strangely, when I’m working with JPEGS, I run across issues where they won’t display either. Is there a specific way I should be saving said images to take advantage of subsampling?

[Author]

Posts