Alex P.

Wow, thanks for the fast reply! Totaly understand, I actually added a pen minutes before you wrote. Thank you very much for the general directions, really appreciate it!

Hello everyone, I'm building a parallax header for a new website and for some reason it's not working as expected. Tried everything I could find to optimise it, reduced the CSS rules to minimum, added will-change, reduced the layers but it still works bad on computers with integrated graphics card. (Also CodePen demo available bellow) Originally started with 9 layers https://lifeslide.webiz.team/?all_layers and now reduced to just 2 parallax layers https://lifeslide.webiz.team/ and still doesn't work ok... My current best guess is that the images have too much going on on them and the browser is having hard time to repaint. If you have any idea why the parallax is slow or what can be done to be optimised will really appreciate your help. Thank you, have a great day, Alex const tl = gsap.timeline({ scrollTrigger: { trigger: ".hh_top", start: "top top+=67px", end: "bottom top", scrub: true, force3D: true, } }); gsap.utils.toArray(".parallax").forEach(layer => { const depth = layer.dataset.depth; const movement = -(layer.offsetHeight * depth) tl.to(layer, {y: movement, ease: "none"}, 0) });