onPressed or onclick Stopping a carousel swipe position .

[thaka 0 Likes (Newbie)]

Hello friends;

 

First of all my English is bad, so I apologize.

 

I'm new in GSAP world, I am studying a carousel Swipe provided by another member of the forum. following link:

 

 

My doubt be the next point, when you run the onPressed event in Draggable in the middle of execution of TweenMax, it overwrites the position x performed in transition by Tweenmax.to (), is there any possibility to disallow the onPressed or the default event while the animation TweenMax is active?

 

Thank you.

See the Pen pJyYEO by bdang (@bdang) on CodePen

[OSUblake 9,990 Likes (Superhero)]

There's a logic error in all the events. You need to rework how the activeID is set. Interrupting the animation negates the activeID, and does something with the 'item_next' class.

// This code is in all the events
if($(this).hasClass('item_next')) {activeID++}
else {activeID--};
    
navigateSlide();

You can prevent stuff from happening if a tween is running, but that's probably not the behavior you want because then you can't change directions or advance to the next slide. You'd have to wait until the animation was over.

[Underlog 0 Likes (Newbie)]

Hi there, I know it's been a lot since this post was done but I've been using this code and I can't get the navigation looping, can you help me?

[Carl 9,066 Likes (Superhero)]

HI @Underlog

Do you have a question relating to GSAP. As I understand it what you are asking is going to require re-writing a bunch of the logic to the demo you are referencing. That isn't something we created or support. We really need to keep our support focused on the GSAP API.

 

If you only had buttons controlling the images I would say that you could probably just detect when the activeID gets to the last image you can reset that value to 0 if they hit the next button again. When that happens you could just animate all the images fly by and you could show the first one again. If you are swiping left and you get to the last image (on the right) swiping left again would then have to cause all the images to fly by to the right to get to the first again and that would be super awkward. I think its going to be a considerable re-write of the code to have a smooth slider that infinitely and seamlessly loops as you keep swiping. 

 

@OSUblake has a great "bare bones" demo that probably does most of the hard stuff that you need.

 

 

See the Pen veyxyQ?editors=0010 by osublake (@osublake) on CodePen

 

also see this thread:

which includes this demo:

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

 

[Underlog 0 Likes (Newbie)]

Thanks a lot @Carl