Using background-attachment:fixed in safari on the ipad

Question

I\'m looking to recreate an effect similiar to the popular science app. Basically have one big background image and then have HTML/CSS layer on top of that. When the user sc

Answer 1

Similar to Ig365, I found that Angolao's solution causes image repeat, depending on image proportions; however, Ig365's image doesn't mimic the placement of background-fixed . To do this, add a background-position-x: 50%;. (Depending on your image dimensions, you may also need background-position-y: 50%.)

#background_wrap {
    z-index: -1;
    position: fixed;
    top: 0;
    background-position-x: 50%;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-image: url('imageURL');
    background-repeat: no-repeat;
}