Bug Tracker


Ticket #1924 (closed bug: fixed)

Opened 6 years ago

Last modified 6 years ago

UI Draggables (and perhaps others?) locations are off when parent element has a border

Reported by: rbrackett Owned by: paul
Priority: major Milestone: 1.2.2
Component: ui Version: 1.2.1
Keywords: Cc:
Blocking: Blocked by:


When a draggable's positioned parent (referenced as options.pp) has a border, the new position is off by +1 pixel. This occurs each time the draggable is dragged and is most apparent when using the "grid" option. The error that causes this is repeated in many places, three of which I have identified (though there might be more):

ui.mouse.js, line 167-168:

this.pos[0] -= o.po.left; this.pos[1] -= o.po.top;

ui.mouse.js, line 222-223 (same code):

this.pos[0] -= o.po.left; this.pos[1] -= o.po.top;

ui.draggable.ext.js, line 198-199:

[won't detail the code here because it's quite long]

In all cases, extra space that might be created by a border is not accounted for in options.po and is in draggable.pos, creating a discrepancy and ultimately moving the draggable over.

An easy solution might be to add in the border width in those places, like so:

this.pos[0] -= o.po.left + (parseInt(jQuery.css(o.pp, "borderLeftWidth")) this.pos[1] -= o.po.top + (parseInt(jQuery.css(o.pp, "borderLeftWidth"))

but that is definitely not ideal, since it is both repeated in multiple places and slow if done multiple times.

Change History

comment:1 Changed 6 years ago by rbrackett

Whoops, I should note that those line numbers are for revision 3817.

comment:2 Changed 6 years ago by paul

  • Owner set to paul

comment:3 Changed 6 years ago by paul

  • Status changed from new to closed
  • Resolution set to fixed

Thanks, this is fixed in the rewrite for 1.1.

Please follow the  bug reporting guidlines and use  jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.


Add a comment

Modify Ticket

as closed

E-mail address and user name can be saved in the Preferences.

Note: See TracTickets for help on using tickets.