Simple hamburger animation

[Forrest Longanecker]

Hello, I am just starting to use GreenSock and have really enjoyed it so far!

I am having a strange issue when trying to target the first defined path in my hamburger SVG the other two paths referenced the same way are behaving as they should but the one with the class "top" will not respond to any input.

I feel like I am missing something simple but am not sure what that may be. I have been using codepen on a Mac with FireFox.

Thanks in advanced!

See the Pen XWrdXGq?editors=1010 by forrestlonganecker (@forrestlonganecker) on CodePen

[OSUblake]

You can't use the variable name top at the global level because it refers to something else.

https://developer.mozilla.org/en-US/docs/Web/API/Window/top

 

Just rename your top variable to something else.

[ZachSaucier]

Hello Forrest and welcome to the forums!

 

As Blake said, you've stumbled upon an edge case of browsers. You can use a different variable name or just use a string like ".top" to work around this issue.

 

Happy tweening.

[Forrest Longanecker]

Oh wow,
That clears it up.

Thank you so much for the quick response!