Search the Community
Showing results for tags 'sine'.
Hello everyone, i'm trying to reproduce this : https://heliasoils.com An animated sine background. I tried to play around with a canvas but i'm kinda stuck : https://codepen.io/Ziratsu/pen/BaaWGex Do someone here have done a similar animation ? Do I need to use the canvas or something else ? Finaly how to link the sine wave with greensock, to create a slider or even better animate it with the scroll ? Best, Enzo
Hi. I'm in last time seen some amazing wave SVG with some sine named function, i am interested. But i haven't Club access. https://bannerwave.com/ In header as you see this too made with GSAP, so i interested and will be thankful if someone create simple, cleaner codepen demo (please without GSAP premium plug-ins). Second some wave sine amazing demo in GSAP morphSVG demo plug-in but not sure how to you're did it and how to use. Thanks.
How to ensure that the snake-like animation in https://codepen.io/TobiReif/pen/b7809c58663ddac3572f5594ffc4f5fe/ is even? Each column of dots should move up with ease-in-and-ease-out (eg sine) and should move back in the same way: slow upwards, fast upwards, slow upwards, then slow downwards, fast downwards, slow downwards; loop. The current animation is roughly what I want, but it seems to be faster at the top and slower at the bottom. Each column of dots seems to jump up and down, resting at the bottom only. I had no luck using repeatDelay, and I think a clean solution would not involve repeatDelay. Instead I need something like "sineAnimationUp;reverse;loop" or simply "sineWaveAnimation" == forth and back exactly like a sine wave.