by 1st of all, I’m a code illiterate. I am just a foolish monkey who sees code on codepen, isn’t going to comprehend it, but plays with variables until finally he is happy with the success. I know approximately practically nothing about CSS and JS scripting, so probabilities are the solution to my problem is pretty obvious.
Anyhoo, I have been functioning on this website in Elementor for a pal and he desires me to insert delicate history animation of h2o ripples. It was shockingly tough to locate anything at all shut to what we want, but sooner or later I uncovered this dude’s code [https://codepen.io/jonobr1/pen/eedpwP?editors=0010](https://codepen.io/jonobr1/pen/eedpwP?editors=0010) . In my reversed “monkey do -> monkey see” fashion I tweaked the code a very little bit to get rid of the rain drops and change the angle (I manufactured the ripples even circles as a substitute of ellipses). This is what I finished up with:
So next I did some digging on how to put into practice that into elementor and I swiftly learned that you do it by the HTML widget. Ok, looks simple peezy. But then the concern from the title happens.
I click update and even though the ripple rings are generating properly, I can no longer scroll. I imagined I could do the job my way all-around that with z-index, but no luck. What I’d like is either for the bg animation to continue to be as a sticky though the user scrolls down, or it’s possible the animation could just lengthen all the way to do the bottom of the webpage (I picture the former would be a lot more useful resource friendly however).
What can I do to make it function? Also be sure to be patient with me and converse to me like to a complete layman ^^’
Cheers!
