[Stopping an animation between two labels]

Problem is resolved. Thanks everyone!

[Stopping an animation between two labels]

Hi there everyone,

I'm hoping to explain this as clear as possible.

I have two buttons: one button Is for playing a tween between two certain labels inside a timeline. The second button is for canceling the tween from the first button, and starting a new timeline.

var tween1Tl = new TimelineMax({ repeat: 0, paused: true});
tween1Tl


.add("startLabel")

.fromTo('#something', .5, {x:'-50', opacity:0}, {x:'0', opacity:1,ease: Power3.easeInOut})
.fromTo('#somethingElse', .5, {y:'-50', opacity:0}, {y:'0', opacity:1})

.add("halfwayLabel")

.fromTo('#fooBar', .5, {scale:0, opacity:0}, {scale:1, opacity:1,ease: Power3.easeInOut})
.fromTo('#fooBar2', .5, {x:'-50', opacity:0}, {x:'0', opacity:1,ease: Power3.easeInOut})

.add("endLabel")

;

 

$('#btn1').on('click touchstart', function() {
        
tweenTest = Tween1Tl.tweenFromTo("halfwayLabel", "endLabel");
  

});

$('#btn2').on('click touchstart', function() {
        
			tweenTest.pause(0);
 			tween2TL.play();

 ;

My problem:

When I press btn2, I want tweenTest to fully stop and dissapear.. So actually to have it pause at "startLabel".  As you can imagine, when I pause tweenTest right now,  it pauses halfway, so the assets are still there.. I hope I've made my intentions clear and would love someone to help me out.

Thanks in advance!
 

[Draggable knob and scroll area]

Hi Carl,

Thanks for your great reply, I could actually make it work which I want to thank you for.
My only problem is, my scrollbar doesn't work right with this solution. I want to have both possibilities, using the scrollbar aswell as using the knob to scroll.

Is there a way to make this work?

Thanks.

[Draggable knob and scroll area]

Hi all,

In the codepen example that is provided, the knob and the scroll-bar are linked, which is what I want to accomplish for my project.
The content area is also draggable by mouse, which I want to strip out of the code, but I can't seem to make it work..

In summary: i want the knob to link to the scrollbar of my page.. that's it. (So if the knob is fully rotated, the scrollbar is at the bottom of the page etc.).

I would appreciate any help. Thanks in advance!

 

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

[Draggable knob and browser volume]

Hi everyone,

Is there a way to make the Draggable knob link to the (browser) volume?
https://greensock.com/throwpropsplugin

I'd like to hear if there is.

Thanks in advance!