Jump to content
Search Community

Modded Draggable Auto-Slider Gsap3 breaks

value32 test
Moderator Tag

Recommended Posts

Hi there,

 

I successfully modified Blake's Pen "Draggable Auto-Slider" 

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

 to be more responsive to fast touch gestures like provided in the swiper framework. when i tried to update everything to gsap3 the code breaks without error messages. Would someone be able to point out where I did wrong? thanks so much in advance!

 

best

See the Pen ExKvObb by value32 (@value32) on CodePen

Link to comment
Share on other sites

Thanks, Zach! Didn't saw this, my bad. Unfortunately I am not getting this to work like before when alterting the slideshow example in gsap2. The first swipe is fine, after that it gets weird. I'm not super familiar with Draggable, Snapping or Wrapping. I just want the slide animation to start right after dragging ends (no snapping, no inertia etc). It would be awesome if you could look at the pen and give me a hint... Thanks alot!

See the Pen ExKbZmN by value32 (@value32) on CodePen

Link to comment
Share on other sites

Totally understand that 😃 My goal is to build my own gsap sliders instead of hooking on top of touch/swipe capabilities from popular slider-framework like "swiper".  the main problem with the example above is that it feels slow in my opinion. while i have to over-swipe the snap area to trigger the animation other frameworks keep it simple. on a drag's end they animate to the nearest border within the direction. this give's you a super fast and "common reactive" feeling when swiping quickly.

 

TL;DR: need no throw/inertia logic, just snap-animate immediatly onDragEnd

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.
×
×
  • Create New...