Opened 6 years ago

Closed 6 years ago

#10625 closed bug (duplicate)

Incorrect behavior when using resizable with position: fixed

Reported by: stw99 Owned by:
Priority: minor Milestone: none
Component: ui.resizable Version: 1.11.1
Keywords: Cc:
Blocked by: Blocking:

Description

Setting resizable on a fixed-position element. When resizing, the element jumps across the screen.

Specific details:

  1. The element is resizable horizontally, and the position is specified by setting the 'right' css property.
  2. When the element is resized, the 'left' css property gets set to 0 and the element jumps across the screen.
  3. This occurs in both IE 11 and Chrome 37, but DOES NOT occur in Firefox 32.
  4. A similar problem occurs when the element is resizable vertically, and the position is specified by setting the 'bottom' css property.

Minimal example:

http://jsfiddle.net/ukku7feh/2/

Possible workaround:

A minimal example of a possible workaround can be found here: http://jsfiddle.net/13enw3q5/1/

It basically involves stopping resizable from setting the 'left' property, and instead updates the 'right' property appropriately.

Possible solution:

Locating the fixed element using the 'right' property is useful for placing the element on the right-hand side of the page. It also means that the position of the element is updated if the vertical scrollbar appears/disappears. Similarly for using 'bottom' rather than 'top'.

The resizable implementation seems to locate the element by setting 'left' and 'top', irrespective of whether the original element was located using 'right' or 'bottom'. Instead, perhaps it should locate the element in same way as the original element, as in the workaround above.

Change History (3)

comment:1 Changed 6 years ago by Scott González

Resolution: notabug
Status: newclosed

This isn't about fixed positioning, it's about positioning from the right. Resizable only supports positioning from the left and top. I'm sure there's at least one duplicate of this, but I can't find it right now.

comment:2 Changed 6 years ago by tj.vantoll

Resolution: notabug
Status: closedreopened

comment:3 Changed 6 years ago by tj.vantoll

Resolution: duplicate
Status: reopenedclosed

Duplicate of #3011.

Note: See TracTickets for help on using tickets.