Search the Community
Showing results for tags 'overlay'.
Found 1 result
-
Hello everyone! I'm dealing with this animation: When the background image is in the middle of the viewport, an animation should start on its black gradient overlay that leaves only the center of the photo visible with a spotlight (in Italy we call it bull's-eye light) effect (the one used in theaters on actors) and an svg appears (always on scroll) with a scale effect. Also the animation should be pinned untill it's finished. But when I pin it, the overlay square moves down and scroll on its own. In the JS code of the Codepen I wrote the functions maskRadialGradientReveal() which takes care of the timeline (scale the backround image, then apply the overlay and then scale the logo svg I'm not ble to pin the section untill the animation is finished in the maskRadialGradientReveal function. Thank you in advance as always and any suggestions are welcome!?
