JQuery Dragable Offset Error

Question

JQuery Dragable Offset Error

0

У меня проблема с перетаскиванием. Когда вы начинаете перетаскивание, позиция курсоров измеряется относительно [0,0] окна, а не родительский <div> элементов, которые можно перетаскивать.

Например, если родительский контейнер смещен с помощью margin-left:200px, когда вы пытаетесь перетащить элемент, который сидит против левой границы контейнера, он начнет движение только после того, как курсор будет 200 пикселей на справа от этой левой границы.

Для фактической демонстрации см. (Я не мог воспроизвести это на JSFiddle): Демо

Я предполагаю, что это требует некоторой модификации перетаскиваемого источника. Для меня это немного осложнилось.

Есть идеи?

FuriousD 22 окт. 2013, в 09:09

Источник

Теги:

javascript

jquery

css

jquery-ui

draggable

2 ответа

Ещё вопросы

Frank van Luijn · Answer 1 · 2013-10-22T06-17-00.000Z

Вы можете заставить родителей компенсировать использование $ (element).offsetParent(). Особенно удобно, когда исходные элементы позиционируются как абсолютные. Вы можете написать цикл, чтобы просмотреть все родительские элементы и соединить их смещения.

И FYI ваша демонстрация не работает на устройствах с сенсорным экраном;)

Обновление. Я посмотрел вашу демоверсию (наконец, на ПК снова). Если вы удалите "position: relative" из div.container, перетаскиватели работают как ожидалось (или, по крайней мере, я думаю, вы ожидаете, что они будут вести себя: D).

Я не совсем уверен, как бы я реализовал это в контексте перетаскивания, хотя.
@FuriousD, я обновил свой ответ, можете ли вы подтвердить, что это помогает?
Спасибо за помощь. Я сделал некоторые изменения в draggable.js, которые фактически вызывали проблему с самого начала.

Patrick Steenks · Answer 2 · 2013-12-07T17-50-00.000Z

У меня также была эта проблема, и я смог ее решить, сначала вычислив смещение ограничивающего прямоугольника в окно, как слева, так и справа. Затем я обновил позиции сдерживания x1, y1, x2, y2, чтобы отразить позицию ограничивающей рамки.