Jump to content


Draggable knob inside a fixed container

Moderator Tag

Recommended Posts

I have a Draggable "knob" that sits in a header with a fixed position. It initially works as intended, but once you start scrolling down the page it gets harder and harder to rotate the knob - almost as if there's resistance being added to the knob as you scroll further down.


Here's a quick codepen to demonstrate what's happening (scroll down and try using the knob): 

See the Pen hrvnw by anon (@anon) on CodePen


Is there a way to configure or adjust Draggable so that I don't have to do a workaround like temporarily setting the position of the header to absolute while the knob is being used?

Link to comment
Share on other sites

Interesting - I hadn't anticipated that scenario, but thanks for pointing it out. Would you mind trying the attached [updated] version of Draggable which should factor in the scroll position? 


Just for the record, it had nothing to do with extra resistance - it's just that it was mis-plotting the rotation origin (pivot point), as if it were in the original position of the unscrolled page (in this case, at the top). 


  • Like 3
Link to comment
Share on other sites

The updated version is working great... thank you!

Link to comment
Share on other sites

  • 3 months later...

Hello again!


I was just revisiting this and noticed that this fix doesn't work in Firefox (v30.0).


Can anything be done about this?



Link to comment
Share on other sites

  • 4 weeks later...

I'm so sorry for the delayed response. Your question slipped through the cracks. I have attached a preview of the next release of Draggable - does that work better for you? 


Link to comment
Share on other sites

  • 1 month later...

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.