Ticket #3628 (closed bug: worksforme)
Resizable position: fixed is not supported
| Reported by: | tmm1 | Owned by: | |
|---|---|---|---|
| Priority: | major | Milestone: | 2.0.0 |
| Component: | ui.resizable | Version: | 1.6rc2 |
| Keywords: | Cc: | ||
| Blocking: | Blocked by: |
Description
if a div is position fixed, ui.resizable will make it position absolute, which causes it to jump on the page if you're scrolled down
Change History
comment:2 Changed 4 years ago by scott.gonzalez
- Priority changed from minor to major
- Milestone changed from TBD to 1.6
comment:4 in reply to: ↑ description Changed 4 years ago by Charuru
Has this yet been fixed?
comment:6 Changed 2 years ago by Chevex
Okay, so I've tried everything. I need an element to be fixed position. I tried setting position back to fixed in the resize stop event. Nope, css properties top and left are set differently for absolute positioning so changing it to fixed made the element jump. Okay, so I tried to save it's position in the resize start event, and then set the position in the stop event. Nope, the absolute positioning changes BEFORE the resize start event. Alright fine, everywhere the DIV is dragged or created I store the ending position and set it in the resize stop event. That last one worked, but it would be nice if this bug was just fixed.
comment:7 Changed 19 months ago by daveprimed
puting a div inside the fixed element and making that resizeable, height 100% or something like that means it will stay fixed and you'll me able to resize. Firefox doesnt like this?
comment:8 Changed 19 months ago by codeblock
Another vote for this. Can't get any of the workarounds working, and need to resize a div that is fixed to the bottom of a page.
comment:9 Changed 12 months ago by SergeSol
I met such problem too. I fix it after resize is finished. This is my workaround:
$("#somebox").resizable({ ...,
stop: function() {
var boxTop=jQuery("#somebox").offset().top;
var boxLeft=jQuery("#somebox").offset().left;
$("#somebox").css("position", "fixed");
$("#somebox").offset({top:boxTop,left:boxLeft});
},
...
});
comment:10 Changed 8 months ago by scott.gonzalez
#8580 is a duplicate of this ticket.
comment:12 Changed 7 months ago by tj.vantoll
- Status changed from new to open
- Summary changed from resizable does not support position: fixed to Resizable position: fixed is not supported
If someone watching or commenting on this issue could provide a reduced test case it would help significantly in getting this issue looked. To get you started, use this boilerplate: http://jsfiddle.net/ZgAqH/ Open the link and click to "Fork" (in the top menu).
comment:13 Changed 7 months ago by scott.gonzalez
I can't seem to reproduce it right now, even going back to 1.7.0, but I know this was a real bug. I'm fairly certain I even wrote code to work around this while using 1.8.x in production.
Here's a reduced test case that shows it working: http://jsfiddle.net/ZwNFG/ This really baffles me because I know this was broken. Without a failing test case, I'm not sure there's anything we can do though.
comment:14 Changed 7 months ago by scott.gonzalez
- Status changed from open to closed
- Resolution set to worksforme
Based on that fiddle, this is working. Fixed position resizables break if the element is also draggable, see #6939.
comment:15 Changed 3 months ago by CodeTunnel
This is still broken. Please re-open. Here is a reduced test case and work around.
Bug:
Simply scroll down on the page and then try to resize the fixed element. It jumps position on the page during resize.
Workaround:
The simplest workaround I've found is to make the resizable element a child of the draggable element. This works but adds unnecessary complexity. It would be much nicer if resizable simple worked on the fixed draggable element.
comment:16 Changed 3 months ago by scott.gonzalez
@CodeTunnel: Upgrade to jQuery 1.9.1.


This is caused by the bugfix put in for #1749