I want to make the background of my Hero Section to move slightly, and I did it by setting the background in another div with Absolute positioning + Move animation on Page Load.
There was also a transparent stars overlay background (currently display set to “hidden” because we’re working on a more quality asset) with similar move animation hence why the initial background has a set perspective.
My problem > It appears to me that the animation is lagging while moving on desktop sometimes + I don’t know if the mentioned animation practice is good enough for desktop screen responsiveness
My question > How can I fix this without degrading the background visual quality and what would be the best practice in this situation?
Also: What do you suggest I do with the “brain” video, is it okay for it to be added on the website with this method?
Read Only link: Webflow - Growww
Webpage Preview link: https://growww-website-fa11c6.webflow.io/
Class context:
Hero Section - section_hero
Background - background-layer
Background Overlay - background-overlay-layer
Background Animation - Hero BG [Move Load] 2
Background Overlay Animation - Hero Overlay BG [Move Load]