Fixed background image with ios7
background, css, html, ios, media-queries
Solution
Using `background-attachment: fixed` with `background-size: cover` causes issues on most mobile browsers (as you've seen). You can try using `background-attachment: scroll`. This won't give your desired effect, but you'll see the images at least. You could use a media-query or two to limit it to devices that are tablets or phones by using `@media screen and (max-device-width: 1024px){}`
OR
You can use `background-position: scroll` and include some javascript that will keep the image at the scrolled position (keeping it at the top of the window): DEMO
Problem
I have a project that I am using the fixed background image. It works great on everything except ios7. On the ipad the background image is zoomed in and blurry. Here is the CSS code I am using - ``` .header { display: table; height: 100%; width: 100%; position: relative; color: #fff; background: url(../images/boston2.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } ``` here is a link to the live page - www.wdeanmedical.com What am I missing?