Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Lolia Trafam

Play gltf animation based on scroll

Go to solution Solved by OSUblake,

Recommended Posts

Hi , have a nice day 

any one know how we can play gltf animation with scroll use scroll trigger ??

See the Pen WNjNjyd by LoliaTrafam (@LoliaTrafam) on CodePen

Link to comment
Share on other sites

Some of the examples found in the thread may also assist you in some way.

 

  • Like 2
Link to comment
Share on other sites

43 minutes ago, Shrug ¯\_(ツ)_/¯ said:

Some of the examples found in the thread may also assist you in some way.

 

Oh that's very nice example , but i mean i want to load an existing animation from blender on scroll , like i want to man run on scroll , i wish i can explain 

Link to comment
Share on other sites

27 minutes ago, Lolia Trafam said:

animation from blender on scroll

Maybe the links in this post will also help you some. ¯\_(ツ)_/¯

Link to comment
Share on other sites

Here's a start. It might be better to ask on the three.js forums about how to do this, like how to advanced the progress/time without it auto-playing. We can really only offer guidance on GSAP's API. Three.js is a completely different animal.

 

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

 

  • Like 1
Link to comment
Share on other sites

  • Solution
23 minutes ago, OSUblake said:

how to advanced the progress/time without it auto-playing.

 

This seems to work, but I don't know if that's the best way to do it. Again, the three.js forums might be able to offer up a better solution.

 

let proxy = {
  get time() {
    return mixer.time;
  },
  set time(value) {
    action.paused = false;
    mixer.setTime(value);
    action.paused = true;
  }
};

 

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

 

 

  • Like 4
  • Thanks 1
Link to comment
Share on other sites

Nice one @OSUblake.

 

This related Three.js Forum thread has some good advice for those seeking similar. If that's actually your thread @Lolia Trafam then please reference this GSAP thread over there as this discussion here might help other Three.js + GSAP users also. 😉

  • Like 2
  • Thanks 1
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.

×