Jump to content
Search Community

3D cube animation based on mouse cursor position

venizia03 test
Moderator Tag

Recommended Posts

Hey venizia and welcome to the GreenSock forums! Thanks for being a Club GreenSock member. We couldn't do what we do without people like you.

 

Yes, it is quite possible to rotate a cube based on cursor position. What sort of cube do you have? CSS? WebGL? If you provide a minimal demo we're happy to help you set it up if necessary :) 

 

The core of the approach is getting the mouse position and then setting (or tweening to) some rotation value based on a formula that you have set up.

 

Here are some older threads related to the subject that might be useful to you. They don't use GSAP 3 but should be easy to convert if necessary:

 

Link to comment
Share on other sites

7 minutes ago, venizia03 said:

What about performance impact? Should I worry about it?

If you have a lot of these or the element that you're rotating has filters or something intensive like that applied to it there might be an issue. Most the time you probably wouldn't be able to notice any performance impact.

Link to comment
Share on other sites

  • 3 years later...

Would it be possible to affect say 30 cubes on in the same section, so that they all point to the cursor position? Each would have a slightly different angle — how would one go about calculating that?

Edited by jonny_rich_
spelling
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...