Parallax Hero Изображение становится серым после изменения размера окна / Devtools ⇐ Html

[Anonymous]

Я использую jquerystellar для создания героя Parallax в верхней части страницы.

Код: Выделить всё

data-stellar-background-ratio="0.5">


Apartment close to Old Town


Address, 8700, abc

[url=https://example.com]Book now[/url]


< /code>
/* overlay & basic styling */
.site-blocks-cover {
min-height: 600px;
height: 100vh;
background-position: center top;
background-size: cover;
background-repeat: no-repeat;
position: relative;
}
.site-blocks-cover::before {           /* dark overlay */
content: "";
position: absolute;
inset: 0;
background: rgba(0,0,0,.4);
}
< /code>
// parallax initialisation
$(window).stellar({
responsive: true,
parallaxBackgrounds: true,
parallaxElements: true,
horizontalScrolling: false,
hideDistantElements: false,
scrollProperty: 'scroll'
});
< /code>
[b]What actually happens[/b]
[list]
[*]Load the page.
[*]Scroll down (e.g. ~600 px – hero section is now far above the viewport).
[*]Resize the browser window or open DevTools (F12).
[/list]
As soon as the resize event fires the hero’s background turns solid grey (only the semi‑transparent overlay remains) from the top of the page down to the current scroll position.
Refreshing the page fixes it until the next resize.
[b]What I’ve found so far[/b]
[list]
[*]Stellar updates background-position on every resize so that the parallax ratio stays correct.
[*]During its re‑calculation it takes the current scrollTop into account.
[*]Because I’m scrolled 600 px already, Stellar moves the background up by > 600 px, effectively sliding the entire image out of the element’s box.
[/list]
The pseudo‑element overlay stays put → I only see the dark overlay, which looks like a grey block.
[b]Questions[/b]
How do I fix the problem with the grey background on scroll? I really prefer this effect over CSS: background‑attachment: fixed

. Я пытался с $ (window) .stellar ('refresh') , но это не сработало и не похоже на решение (но, возможно, есть). Я чувствую, что у меня не хватает вариантов.

Подробнее здесь: https://stackoverflow.com/questions/797 ... e-devtools