When I apply a linear gradient to a background image, it looks fine when the page loads.
As soon as I scroll, about 102 pixels of the gradient disappears at the bottom of the image and does not return.
The image is 700px high and jumps up the same number of px as soon as you scroll.
I use following code:
<section class=‘hero-wrap’ style=‘background-image: linear-gradient(to right,rgba(0,0,0,0.9),rgba(0,0,0,0), transparent), url(’images/bg-1.jpg‘);’ data-stellar-background-ratio=‘0.5’>
When the data-stellar-background-ratio=1, the gradient does remain intact.
When I apply a linear gradient to a background image, it looks fine when the page loads.
As soon as I scroll, about 102 pixels of the gradient disappears at the bottom of the image and does not return.
The image is 700px high and jumps up the same number of px as soon as you scroll.
I use following code:
<section class=‘hero-wrap’ style=‘background-image: linear-gradient(to right,rgba(0,0,0,0.9),rgba(0,0,0,0), transparent), url(’images/bg-1.jpg‘);’ data-stellar-background-ratio=‘0.5’>When the data-stellar-background-ratio=1, the gradient does remain intact.