Slider transitions with GSAP and Scrolling

[Dipscom]

Hey Yulia,

 

You just forgot to add jQuery to your pen. Your code is fine and works as expected once you add jQuery to it.

[yulia]

Thanks for such a quick reply! I was really stupid ?

But now, when I added new transformations to the slides, the slider again does not work

[Dipscom]

Now you're missing a "." before the methods... ?

 

.to('#indicator', 0.5, {
    width: '40%',
    ease: Power0.easeOut
  })
to('.pagination-bar', 0.5, { // You're missing the "." here
    backgroundColor: 'green',
    ease: Power0.easeOut
  })

 

Maybe, take a little break. You might be overworking yourself.

 

[yulia]

@Dipscom Jesuschrist ? what a shame! I have to do hara-kiri ...

 

Love you ?, thanks for the help!

[Dipscom]

14 minutes ago, yulia said:

I have to do hara-kiri ...

 

As you're not at a master level yet, you can't commit hara-kiri. You can only chop off a toe.

[yulia]

Hi guys! Another question with the same slider

See the Pen EJqVEz by yuliarushay (@yuliarushay) on CodePen.

 

Is it possible to add slide autoplay? How to do it? I see options only with slide navigation buttons, but not with Forward and Back buttons.

Help me please)

 

Edited May 7, 2019 by Dipscom
added hyperlink

[Dipscom]

When you say "add slide autoplay" what is it that you are after?

 

You added a bunch of pauses in your timeline it won't play thru the whole thing unless you remove them.

[yulia]

That is, I can not do everything within one timeline? Need to break into several timelines?

[Dipscom]

You can do either way.

 

Depending on the complexity of your animations is advisible to break into several timelines but I guess that is not what you are trying to achive here.

 

What is it that you want? A button to toggle autoplay that if clicke the timeline plays completely? And if not, it pauses on those spots?

 

If that is what you are after, instead of having those .addPause() calls, you call a function to check if the timeline should pause or not. See bellow.

 

See the Pen bydNew?editors=0011 by dipscom (@dipscom) on CodePen.

[yulia]

45 minutes ago, Dipscom said:

You can do either way.

 

Depending on the complexity of your animations is advisible to break into several timelines but I guess that is not what you are trying to achive here.

 

What is it that you want? A button to toggle autoplay that if clicke the timeline plays completely? And if not, it pauses on those spots?

 

If that is what you are after, instead of having those .addPause() calls, you call a function to check if the timeline should pause or not. See bellow.

 

 

 

Exactly what I need! Only without a button Autoplay. Added to my slider, now it works perfectly Thank you ?