[Morph SVG on Scroll]

Thank you for the answer! Just what I was looking for.

[Morph SVG on Scroll]

I am trying to morph SVG on scroll. I have two shapes with id's #shape-1 and #shape-2. What I want is after say 20px of scroll shape-1 morphs into shape-2 and when we again scroll back up the shape-2 reverts back to shape-1.   I am able to morph the first time but can't seem to get the proper logic to morph every time the user scrolls above or below a certain scroll value (20px for instance).

See the Pen owYqBE by rohitgd (@rohitgd) on CodePen