CSS value transform turn off background-attachment: fixed
in Firefox.
Here is the example
div { transform: translate3d(0,0,0); // if remove starts to work width: 100%; height: 2000px; background-image: url('http://www.wallpapereast.com/static/images/001_Fish-Wallpaper-HD_hkNsK33.jpg'); background-size: cover; background-attachment: fixed; }
<div></div>
if you remove transform from CSS it starts to work. Reproducible only in FF.
Definition and UsageThe background-attachment property sets whether a background image scrolls with the rest of the page, or is fixed.
Set a background image using the HTML body elementAdd the bgproperties="fixed" code into the body element, as shown below. Next, add the background="location" attribute to the body tag, where location is the relative or absolute URL of the image. In the above example, background="bg.
The background-attachment property is used to specify that the background image is fixed or scroll with the rest of the page in the browser window. This property has three values scroll, fixed, and local.
background-attachment:fixed;
doesn't work when any 'transform' is applied
and that's a bug in firefox and it is not yet fixed.
Reference: https://bugzilla.mozilla.org/show_bug.cgi?id=1292499
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With