atcel Posted June 11, 2020 Share Posted June 11, 2020 In my codePen I have two icons with the same hover animation and it works independenly but altought I´m using the same class, I have the animation code twice in my Js. I tried to use a loop but I couldn’t make it works. There is a way to use a loop without the needing of JQuery? See the Pen NWxNrML by Atcel (@Atcel) on CodePen Link to comment Share on other sites More sharing options...
ZachSaucier Posted June 11, 2020 Share Posted June 11, 2020 Hey atcel and welcome to the GreenSock forums. 7 minutes ago, atcel said: I tried to use a loop but I couldn’t make it works. There is a way to use a loop without the needing of JQuery? There's literally always a way to do something without jQuery There are lots of ways to do loops in JavaScript: for loops, while loops, .forEach, etc. I would iterate through each .logotype and set things up as necessary. That way you can use the element as the scope for other selectors that you have. See the Pen mdVPOQV?editors=0010 by GreenSock (@GreenSock) on CodePen For more details, I highly recommend my article on animating efficiently that goes into more detail about how to do this sort of thing, I highly recommend it. Some side notes: I cleaned up your HTML and CSS as I don't really understand your previous approach. You're using the old formatting for GSAP. We highly recommend using the newer (and better) GSAP 3 formatting. There's no point in putting the conditional reverse logic in both the mouseenter and mouseleave events. You always want it to play if it enters and always want it to reverse if it leaves. 1 1 Link to comment Share on other sites More sharing options...
PointC Posted June 11, 2020 Share Posted June 11, 2020 Always a good one to bookmark. http://youmightnotneedjquery.com/ 1 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now