Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home › Forums › CSS › [Solved] Full Page Backgrounds on iOS (background-size: cover) › Reply To: [Solved] Full Page Backgrounds on iOS (background-size: cover)

June 10, 2015 at 4:26 pm #203556
stacigh
Participant

I’m doing something similar. I have a div and a few children inside of it. I’m trying to apply a fixed position to a background image with a size of cover but because I’m using Modernizr I can detect for devices that are touch enabled:

HTML:

<div class="hero">
  ...
</div>

CSS:

.hero {
  background-image: url('...');
  background-size: cover;
}

.no-touch .hero {
  background-attachment: fixed;
}

.no-touch is a class that Modernizr will append to the &lt;html&gt; tag if the device isn’t touch enabled.