Jump to content
GreenSock

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

How to prevent drag outside the wrapper, even browser window?

Go to solution Solved by OSUblake,

Recommended Posts

Hello all,

I have an issue with Draggable,

I inserted your codepen, but it doesn't matter, it happens with any working example where Draggable is.

Try to press and hold your mouse on a wrapper and move it from right to left, then not letting go the left mouse button, leave the browser window and move your mouse, you will see that the drag is still working for blocks.

Why it happens? Is there a possibility to prevent it?

 

Thanks in advance!

See the Pen ZELQqeJ by GreenSock (@GreenSock) on CodePen

Link to comment
Share on other sites

  • Solution

Hi NasKadir!

 

Have you tried using liveSnap? You can limit how far you can drag it.

 

Draggable.create(el, {
  type: "x",
  liveSnap(x) {
    return gsap.utils.clamp(-1000, 0, x)
  }
});

 

  • Like 1
  • Thanks 1
Link to comment
Share on other sites

@OSUblake Thanks for your answer!
I think you misunderstood me, by liveSnap we can limit the dragging distance, right?

But I'm telling about browser window's borders, you can leave it and dragging will still work, just try it:

30 minutes ago, NasKadir said:

Try to press and hold your mouse on a wrapper and move it from right to left, then not letting go the left mouse button, leave the browser window and move your mouse, you will see that the drag is still working for blocks.

 

Link to comment
Share on other sites

@OSUblake But never mind. I think it's not a big trouble.

Thanks for your time!

Link to comment
Share on other sites

7 minutes ago, NasKadir said:

But I'm telling about browser window's borders, you can leave it and dragging will still work, just try it:

 

Yeah, I know what you're talking about, but there's no easy to do stop it. I used to worry about that in the past, coming up with solutions like disabling draggable when it left the window, and re-enabled it when it re-enters, but it didn't seem worth it in the end.

 

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