Jump to content
GreenSock

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

Slider transitions with GSAP and Scrolling

Recommended Posts

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.

  • Like 3
Link to comment
Share on other sites

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

Link to comment
Share on other sites

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. :)

 

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

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

 

Love you ?, thanks for the help!

  • Like 1
Link to comment
Share on other sites

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.

  • Haha 5
Link to comment
Share on other sites

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 by Dipscom
added hyperlink
Link to comment
Share on other sites

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.

  • Like 2
Link to comment
Share on other sites

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

Link to comment
Share on other sites

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

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

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 ?

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.
×