Jump to content
GreenSock

failure13

Just started, can't get it to work at all...

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

:hover is not a className, so GSAP won't find any styles for that. There was also a syntax error in your tweens (missing } at the end of the vars object) so they wouldn't have fired anyway.

 

See the Pen fmzak by jamiejefferson (@jamiejefferson) on CodePen

 

Key changes:

<body class='nojs'>
<!-- remove .nojs on document ready so you can tell the difference between
a page with js and one without -->
$(document.body).removeClass('nojs');
/* only use :hover when .nojs, as CSS :hover triggers before javascript
hover, so GSAP will see the starting values as the :hover ones and have
nothing to tween to */
ul#menu li a.active,
ul#menu li a.hover,
.nojs ul#menu li a:hover {
  ...
}
  • Like 2
Link to comment
Share on other sites

Oh lol about } :D

My bad!

 

Nice solution, pretty clean, thank you :)

Link to comment
Share on other sites

It doesn't look like you defined button.hover in your css

Link to comment
Share on other sites

Goddammit, "." instead of ":"!

Thx for saving my time!

 

Syntax again, i seriously need to concentrate...

Link to comment
Share on other sites

If it helps, maybe you could use something like :hover/.hovered and :active/.activated

Link to comment
Share on other sites

please post new issues in a new thread.

  • Like 1
Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.
×