Raj Soni

Hello, I was able to place the file content into a HTML widget of Elementor. Made it position: fixed. It's now being sticky and behind the content as z-index set to -99. But only the top 5% part of the SVG is being visible. It does not animate fully till the bottom. How can I tackle that?

Hello, Thank you so much for the solution. Can you just confirm whether this is right way or not. 1. I have saved my svg as this - https://drive.google.com/file/d/1ZIee8pxzfaSHkqtHOD8ofbLDyT3OW4nZ/view?usp=sharing Is this is the right way? Or should I remove <div id="svg_01img"> tag? But then I feel it won't work. 2. Then I added background-image: filename.svg to the body class on a single page. 3. I loaded my CSS in the header, and JS in the footer after calling GSAP.MIN.JS before the custom JS. 4. I added onscroll="onscrollFunction" to the body tag of the site. But I can't actually see it working. What am I missing? Sorry for being stupid.

Hello, I have this entire HTML code containing CSS, SVG path, and JS. Now, my client wants to add this animated svg design in a WordPress site as a background which stay on an entire page. Each page will have it's own animated SVG. I have attached the file below of the entire code. I am fairly new to GREENSOCK and never worked with any before. I tried making a separate SVG file by copying SVG code into a new file and saving it as .svg Also, I was able to add it's CSS(in the header) and JS (to the footer). Also, I am making sure gsap.min.js is being loaded before my custom js. If I tried to copy the entire HTML content into a RAW HTML widget and it worked beautifully. But when I am trying to add .svg file as a background it doesn't show anything. Can someone help me with this? Thanks a ton! river_HOME_1.html