Scroll those pages!
#FixedBackgroundImage #background-attachmentMany web designers have pulled out their hair over the lack of the common background-attachment: fixed css style for ios.
There are many solutions out there, from parallax to javascript to replicate the affect of a fixed background image.
However, there is a simpler solution. Really, there is.
Simply put the following div just below your body tag and adjust to your needs:
<div style="width:100%;height:100%;background-image:url("mybg.jpg"); background-size:cover; position: fixed; z-index:-1;"></div>
The important part here is that the dimensions be 100% of the page or container you want to fill. You can adjust the z-index to your other content as needed.
The background-size element allows your image to fill the entire div, and the fixed position allows all other content on the page to scroll while the image stays still.
IOS doesn't like fixed page backgrounds, but adding a full-sized div with a background flies fine in the face of those Apple devices.
Go ahead, give it a try!