Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
kingproo

clear class from timeline

Recommended Posts

Hi kingproo,

 

Welcome to the forums! I see you made a codePen with a minimal case scenario. I am just having a little difficulty understanding what is is that you are asking. I tested your animation and all buttons seem to work. I can also imagine this is not exactly what you want as the animation is a bit strange. If you could elaborate a bit more on what is it that you are trying to achieve, I am more than happy to try to help.

  • Like 1
Link to post
Share on other sites

Thanx @Dipscom,  I have 4 elements in animation(background red). What I Want to do is: when i click to one of those element his position change and the other  continue the infinite animation.

 

Thanx.

Link to post
Share on other sites

I want to fix the selected item, and the other remaining loop.

 

thanx.

Link to post
Share on other sites

I see. Ok, I have amended the pen I forked from you. Have a look to see if that's what you were expecting.

 

My opinion is that you might be overcomplicating things here a bit. Unless you are sequencing things, you don't really need TimelineMax. You can just assign a tween to each of the objects and kill them as needed (which is partially what I did here).

 

If I were to approach this, I would write a function to create the individual tweens and another one that kills it. That way, you could start and stop the movement as needed.

  • Like 1
Link to post
Share on other sites

I want to create a function to test the click after or before position <hr>. If after --> click and animation position disabled 

 

thanx :)609851APenbyPedroTavares.png

Link to post
Share on other sites

Ok, well, again, I am not sure what is it that you are after. There are tons of ways of achieving a check against a position - the trouble is, what situation are we considering here?

 

Where is this <hr> tag? Is it fixed? Does it move around? The easiest way is to simply have an if() statement to check the red box total progress against the tween then, move or not move depending on it.

 

But, the setup you have in mind might be different. That's why the codePen is super helpful. Because it allows us to troubleshoot your code. How about you update the codePen you made with the things you want to achieve? 

Link to post
Share on other sites
Attached is a game image every element make an animation. when a eelement exceeds the red line he raises the animation again, if not after the click moves in the pannel.

sorry I'm not good English why I use goole translation :)

 

981192jjjj.png

Link to post
Share on other sites

Riiight. That is a rather more complicated scenario than: "clear class from timeline".

 

I say there is a lot more that you will need to grasp in order to pull it all. You probably will be better off using a 2D renderer as well if you are looking into making a game. I will follow OSUblake and recommend PIXI.js - for no other reason than, he says it's good. So, I believe him.

 

Your requirement has given me something to focus on, which I am very grateful for. See the bellow codePen. I made it based on your previous questions and this image. Hopefully this is something you can work with. Let me know if you have any problems with it. I will make another one another time with a bit more interactivity to it. I shall post it here when done.

 

See the Pen GorOyw?editors=001 by dipscom (@dipscom) on CodePen

 

Speaking of OBUblake, shotout for him as

See the Pen vNwRdO by osublake (@osublake) on CodePen

was the base for mine and for being an all-round good sport and great source of knowledge.

  • Like 2
Link to post
Share on other sites

Excellent work, Dipscom, plus extra points for using Pixi! I'll throw an inspiration point to Blake as well;)

 

Kingproo,

 

I have to agree 100% with Dipscom. This is not a good case for using a TimelineLite/Max; much better to use individual tweens for each element.  Questions like this can be fun challenges for us all and more often than not our community members will enjoy trying to find the best way to make these things work. As noted above, there is quite a bit of code and logic involved in this type of game that goes way beyond what GSAP does or what we can reasonably help with.

  • Like 1
Link to post
Share on other sites

thank you, I want to use an html code with different elements to test if the player clicked on the correct element or no.

Link to post
Share on other sites

Sorry, I'm not quite sure what you mean. We really have to keep our support focused on what our animations tools can do. For general programming help stackoverflow is great: http://stackoverflow.com/

Link to post
Share on other sites

Good job dipscom! Was that your first attempt at pixi?

Link to post
Share on other sites

Indeed it was. But I have done some work with Three.JS in the past, which is in the same logic and very similar API as PIXI.

  • Like 1
Link to post
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.

×