Jump to content
Search Community

follow mouse?

redtoad test
Moderator Tag

Recommended Posts

I don't even know if I can do this but I've looked at a bazillion examples. If I get this bit finished then I'm mostly done but the tweaking. 

 

I need for my #flying group to follow my mouse. 

Feel free to tell me I'm goofy/doing something wrong. 

 

I have #flying as an svg group because otherwise it can't interact with my triangles. if I make it an svg on its own there is no overlapping them. I tried nesting svgs and then gsap wouldn't work. Please can anyone explain my issue?

See the Pen NWPwzKV by redtoad (@redtoad) on CodePen

Link to comment
Share on other sites

Hi @redtoad,

 

You aren't including gsap.js, or registering your plugins in your CodePen, so I wasn't able to see anything happening.

For mouse follows, this is a good example:

See the Pen WNNNBpo by GreenSock (@GreenSock) on CodePen

More details in the docs for the quickSetter here: https://greensock.com/docs/v3/GSAP/gsap.quickSetter()

  • Like 4
Link to comment
Share on other sites

@redtoad

It might be a caching issue, but is your updated CodePen at the same link? I'm still seeing the same issues. Also, my gut says that it's going to be hard on performance to do a mouse follow animation inside the SVG, as that can't be hardware accelerated.

Also, just looking at the GSAP code, from what I see: left and top values won't be recognized in SVG for positioning of you cicada (an SVG group) so you'll want to use x and y instead.

  • Like 3
Link to comment
Share on other sites

the quickset followmouse thing doesnt have left and top. I replaced my code with it and updated the variables and now I cannot see my cicada. at all. No console error. my animation on that element also isn't firing (that I can see, I suspect it is firing off the screen). 

Link to comment
Share on other sites

thanks @Mikel ...no dice. I've tried a method based off another pen on here and now can at least get the cicada to react.  There's an offset I gotta get rid of. I need him to hover over the triangles but he won't in this example...besides sort of flying away. I'm going to go eat and come back to it. going to be a long night. :-)

 

See the Pen vYEWrMM by redtoad (@redtoad) 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...