Jump to content
Search Community

Different Results Tweening via Javascript vs Tweening via jQuery

hackfin test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

What started out as a simple replacement of a jQuery .hover() function with native javascript has turned into to a roadblock for me. I am replacing a simple hover tween with the native onmouseenter/onmouseleave in a javascript function I have created.  The function is approximately 1000 lines of code so it took some time to break out the components into codepen to demonstrate my problem:

 

If you review the codepen, I have a function in the global namespace that takes options from the user to set certain callbacks or hooks.  Using the original jQuery .hover() function produces the results I want.  The replacement in native javascript does not. However, note that the last 2 buttons use the replacement javascript successfully except the tween is defined at the same scope and does not go through the user hook.

 

If anyone can explain to me why the jQuery function works through the hook while the javascript function does not, I would appreciate it.

 

Also note that the javascript object returned by the tween is different between the 2.

See the Pen OMeKMo by hackfin (@hackfin) on CodePen

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...