Jump to content
GreenSock

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

MISSING: Can't find Draggable flask example

Recommended Posts

Hi guys,

 

I once stumpled upon an example using GSAP Draggable. It was a vertical slider that, when interacting, filled a flask/bottle with liquid.

 

The slider knob had the slider value, and when you dragged it fast the knob would rotate, depending on velocity. 

 

I have searched and searched for this example, as I have thought about it a lot.

 

Can any one find it?

 

Much appreciated. 

Link to comment
Share on other sites

hmm, this smells of something @chrisgannon would conjure. This comes close to your description but I think it misses the mark with the rotation:

See the Pen vjNNew by chrisgannon (@chrisgannon) on CodePen

 

I'd suggest cruising through his pens: https://codepen.io/chrisgannon/pens/public/ Hit next about 100 times. Even if you don't find it (if its not his), you'll be amazed at what you see.

 

  • Like 5
Link to comment
Share on other sites

This was it @Carl! Exactly! Thanks a bunch. Thank you for your quick response, and great help.

 

And @chrisgannon, stop making me feel like a complete amateur! ;-) 

  • Like 2
Link to comment
Share on other sites

1 hour ago, Carl said:

...but I think it misses the mark with the rotation

 

Hmmm... oddly enough, the effect is not present on my desktop computer, as I guess your on as well, but on my phone it is. Superb effect.

 

  • Like 1
Link to comment
Share on other sites

wow, glad to hear that is the right one.

Now I am noticing the little pointer wiggling based on velocity. very cool.

  • Like 1
Link to comment
Share on other sites

5 minutes ago, Carl said:

wow, glad to hear that is the right one.

Now I am noticing the little pointer wiggling based on velocity. very cool.

 

I forked it and made some adjustments so it, on desktop, feels like how it's on my phone. I love that effect. So meaningful.

Credits @chrisgannon

See the Pen EeEoWZ?editors=0010 by Blueblau (@Blueblau) on CodePen

 

 

Do you know why this velocity calculation is different on the phone? 

  • Like 1
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.
×