Jump to content
Search Community

Bounds changed after being zoomed in/out (scale)

Krimo22 test
Moderator Tag

Go to solution Solved by GreenSock,

Recommended Posts

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

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,
});

 

  • Like 2
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.
×
×
  • Create New...