Jump to content
GreenSock

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

problem with draggable autoscroll = true

Go to solution Solved by GreenSock,

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi,

 

First, very nice plugin.

 

I try to use GSAP draggable with the "autoscroll" option, but there is a problem when I scroll down a tile the position is not correctly updated.

 

You can check in the following codepen demo :

 

It's seems to me the problem come from the "position:absolute" in the .st-menu CSS style.

If i remove this property the draggable autoscroll seems to work better.

 

But i can't remove this attribute in my site because it broke my menu.

 

Is there a workaround for this issue with the autoscroll option ?

 

Thank you.

 

Keep up the good work.

 

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

Link to comment
Share on other sites

  • Solution

It looks to me like the problem had to do with the fact that you were creating your Draggable BEFORE you added your element to the DOM, so when Draggable tried to add its "scroll" listeners to all the ancestor elements, none existed. So if you can either:

  • Create your Draggable after you've added your element to the DOM
  • -OR- just disable() and then enable() the Draggable instance to trigger it to add the scroll listeners again (of course do this after you've added it to the DOM). 

Does that help? 

 

FYI, we'll be releasing a minor update to Draggable very soon which you can preview (uncompressed) at https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/Draggable-latest-beta.js

  • Like 2
Link to comment
Share on other sites

You are powerful !!!!!

 

You are right, if i move the "create draggble" after the append, the drag is correct.

 

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

 

Thank you very much.

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