Search the Community
Showing results for tags 'infinite repeat'.
Found 4 results
-
Problem: How can I stop an infinite previous tween, when the following tween with scrollTrigger is ended? In the example the infinite previous tween starts again, after the scrollTrigger tween is ended. You have to wait 2 seconds to see it. I have created a stackblitz which shows the exact problem Stackblitz Example
-
Hello, I'm trying to create a carousel that spins when a button is pressed. I want it to initially ease-into the spinning animation, then spin at a constant speed for an indefinite amount of time (while the code is waiting for a response from the back-end) and lastly ease-out of the animation during a final spin. I tried creating a timeline and adding the 3 animations to it but the middle animation (with it's repeat set to -1) gives me trouble. I haven't found a correct way to go from the second to the third animation. I tried killing the second animation expecting the timeline to proceed to the final animation but that causes the carousel to abruptly stop. So if there was a way to stop the "infinite" animation in a timeline and proceed to run the next animation that would be very helpful. Alternatively a way to repeat the second animation without setting repeat to -1 could also work. Any help is greatly appreciated. -
Hello everyone! I've been racking my brain trying to think of The Right Way™ to do this. In the codepen demo I've been working on, I've worked out how to have an inital timeline, which then moves to the main timeline. The total duration of the timeline is linked to the total pageHeight, and progress is tied to the scroll event. The main timeline currently repeats infinitely as this needs to continue to animate for an unspecificed amount of time (This could vary depending on the page's total scrollHeight). Ideally I would like to have another timeline play at the very end of the duration which resets the 'FOUNDER' text back to the initially displayed state just before the end of the total duration, but I'm pretty stumped on how I should approach this with GSAP given I don't have a fixed distance to scroll. Does anyone have any ideas or methods? Is there a better method I should be using rather than repeat -1 in this instance? Thank you for any help or suggestions in the right direction! Andrew
-
Hello everybody. I am using the TweenLite together with TimeLineLite currently and I think that's much easier to use and can replace it instead of css3. But I have many dive that they are circles (border-radius:50%) and they rotate 360 degree infinitely. I have tried do that via gsap using TweenLite but unfortunately it hasn't any predefine method to do this (TweenMax has repeat property which we can assign a large number for it and simulate infinitely). Does anyone any Idea to help me do this via TweenLite ? because of being lightweight and the fact I'm using jQuery I can't use TweenMax anymore, Thanks For Your Helps.
