Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

mouse drag out of sync with div scale #1275

Closed
hzjux001 opened this issue May 14, 2020 · 11 comments
Closed

mouse drag out of sync with div scale #1275

hzjux001 opened this issue May 14, 2020 · 11 comments
Labels

Comments

@hzjux001
Copy link

hzjux001 commented May 14, 2020

When I change the target div's SCALE, just like "transform: scale(0.457292) translate(0px, 0px);",the movement or dragging in the gridstack is out of sync with the real mouse movement

@adumesny
Copy link
Member

you need to create a reproduceable test case if you want us to take a look. look at the jsfiddle template

@hzjux001
Copy link
Author

hzjux001 commented May 14, 2020

Because In many cases we need to zoom the page,
in the example https://gridstackjs.com/demo/advance.html,
I change the style in grid-stack div
just like
<div class="grid-stack grid-stack-instance-9799 grid-stack-animate ui-droppable" data-gs-animate="yes" data-gs-current-row="6" style="height: 460px;transform: scale(0.7, 0.7) translate(0px, 0px);">
and when we drag or resize by mouse,
the movement or dragging in the gridstack is out of sync with the real mouse movement

@hzjux001
Copy link
Author

hzjux001 commented May 14, 2020

The same is true even if you put the zoom style on the outer DIV
just like
<div style="width:100%;height:100%;transform: scale(0.7, 0.7) translate(0px, 0px);>
<div class="grid-stack grid-stack-instance-9799 grid-stack-animate ui-droppable" data-gs-animate="yes" data-gs-current-row="6" >...</div>
</div>

@adumesny adumesny changed the title when change the target div's scale, mouse drag out of sync with div scale May 14, 2020
@hzjux001
Copy link
Author

Who can help me solve this problem,Please.

@adumesny
Copy link
Member

browser zooming works just fine, so not sure why you would manually scale the div in code...

if you are such in need of a fix, and don't want to fix it yourself, maybe you should consider donating $ to this effort.

@hzjux001
Copy link
Author

How can I donate

@adumesny
Copy link
Member

adumesny commented May 26, 2020

github page and website has donate links https://github.com/gridstack/gridstack.js

@vishaldodiya
Copy link

@adumesny Is there any workaround for this? Like we can calculate position according to scale and pass it to gridstack.

@adumesny
Copy link
Member

adumesny commented Dec 5, 2020

unlikely to get fixed as not a priority or support and I don't understand the use case why you would scale a div (so many things break when scaling in my experience).

HTML5 drag&drop is a lot worse than the JQ version which seems only off by scale factor relative to parent (0,0)

@adumesny
Copy link
Member

fixed in next release.

@adumesny
Copy link
Member

will be in next 9.5 relase.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants