So as mentioned in a previous post, I'm following the advice @OSUblake & have been taking apart projects to try and learn as much as possible. My focus is creating a really nice slider that can be updated and made more complex as I learn. I'm not quite confident enough to make from scratch with GASP, so I'm using a friends Flickity logic for the slider & slowly converting it over.
My goals were to learn how to:
1. drag slides & lock with a natural feel (✓)
2. navigate with touch/swipe & arrow keys (✓)
3. use mousedown to scale slides down for easy navigation (✓)
4. use count up to change numerical data on slides (✓) ♥ to @Sahil for the crazy example!
5. drag a horizontal scroll bar at the bottom that locks to each section (×)
I just can't get my head around number 5. I managed to make it work seamlessly with the GASP draggable knob, but I'm really obsessed with learning how to make a horizontal scroll bar correspond with a slider with draggable.
Here's the example I'm trying to recreate (found on the Greensock example page) -
Or a lil' GIF for the busy folks
Searched the forums/codepen/deep space for examples of this & no cigar yet! Has anyone seen any examples of this with GASP that aren't buried in super complex websites?