Krimo22 Posted November 22, 2021 Share Posted November 22, 2021 hi guys, i need your help, it's been a couple days that i'm trying to solve this. i have a box wich contains SVGs that are draggable, that box needs its box-sizing to be "content-box", and the draggable SVGs bounds needs to be inside the box (not touching the borders) that's why i created a bounds-box which take 100% width and height of the parent box, and set the draggable bounds to that bounds-box, it works fine , the only problem is when i zoom in or out, the bounds change after dragging the svg around and u can see that the bounds got -1px on every side. thank you. See the Pen zYdXyzx by KrimoCamper (@KrimoCamper) on CodePen Link to comment Share on other sites More sharing options...
OSUblake Posted November 22, 2021 Share Posted November 22, 2021 Welcome to the forums @Krimo22 I'm not exactly sure what's going on, it looks like it might be some type of rounding issue, but you could always just define the bounds yourself like this. Draggable.create(".svgMeuble", { // bounds: ".bounds", bounds: { minX: 0, maxX: 300, minY: -400, maxY: -20 }, allowEventDefault: true, }); 2 Link to comment Share on other sites More sharing options...
Krimo22 Posted November 22, 2021 Author Share Posted November 22, 2021 Thank you for your response, the problem is that the "content-box" is resizable by the user, so i can't define bounds like that, another reason is that the draggable svg are rotatable and are not with the same width and height. Link to comment Share on other sites More sharing options...
OSUblake Posted November 22, 2021 Share Posted November 22, 2021 You can update the bounds with .applyBounds(), and rotation shouldn't matter as the width and height are determined by getBoundingClientRect. Please standby while we investigate this some more. 1 Link to comment Share on other sites More sharing options...
Solution GreenSock Posted November 22, 2021 Solution Share Posted November 22, 2021 It looks like a small rounding error that should be fixed in the next release which you can preview at https://assets.codepen.io/16327/Draggable3.min.js - better? 1 Link to comment Share on other sites More sharing options...
Krimo22 Posted November 22, 2021 Author Share Posted November 22, 2021 It works guys! Thank you so much ! for your help. Great community! 2 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now