Responsive site not working correctly in Chrome

Hello all
Originally my website worked fine in all the browsers but has suddenly started to play up in Chrome.
As you scroll down the page there are 2 background images that display behind white space consecutively, but in Chrome the first image disappears just leaving white space where the second image is supposed to be.
Difficult to understand, but if you view the site in Edge and then Chrome you will get the idea.

The site is www.actionitcs.com

Thanks in advance for any input

See the problem and it might be a chrome bug.
You could try if adding the following to the page head code fixes it:

Code:

---

<script>$(function(){setTimeout(function(){if(xr_chrome)$(".parallax,.parallax2").css("will-change","transform");},1000);});</script>

---

Found a hint for that at stackoverflow but didn't fully test it. Just tried if directly adding the css in the developer console in chrome helped, and it did. But adding the same to firefox caused another problem, so adding some code seems the quickest solution.

Thanks Siran
Will give that a try

Thanks Siran

No luck mate
Appreciate the effort though

Not sure why it didn't work, but this should. You need to place it at the page body instead of the head.

Code:

---

<script>
if(navigator.userAgent.indexOf('Chrome')>=0){
 document.getElementsByClassName("parallax")[0].style.willChange="transform";
 document.getElementsByClassName("parallax2")[0].style.willChange="transform";
}
</script>

---

If you consider to use it I recommend you try it on older versions of Chrome too before uploading to your site.

This is a fully functional variant with multiple parallaxes:

<script>$(function(){setTimeout(function(){if(xr_c hrome)$(".parallax,.parallax2,.parallax1,.parallax 3").css("will-change","transform");},1000);});</script>

Thanks Siran
That did work.

Spamiky thanks for the input.