Search and Top Navigation
#3628 closed bug (worksforme)
Opened November 27, 2008 01:18AM UTC
Closed October 29, 2012 07:18PM UTC
Last modified February 21, 2013 04:00PM UTC
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: | ||
Blocked by: | Blocking: |
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
Attachments (0)
Change History (16)
Changed November 27, 2008 01:26AM UTC by comment:1
Changed January 02, 2009 02:41PM UTC by comment:2
milestone: | TBD → 1.6 |
---|---|
priority: | minor → major |
Changed March 08, 2009 02:33PM UTC by comment:3
milestone: | 1.7 → 1.8 |
---|
Changed September 28, 2009 06:27AM UTC by comment:4
Has this yet been fixed?
Changed August 13, 2010 05:17AM UTC by comment:5
Please, can you fix this...
Changed January 27, 2011 06:00PM UTC by comment:6
_comment0: | 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. NOPE IT CHANGES THE POSITIONING AFTER THE DAMN STOP EVENT TOO. Ugh, can you please please please support fixed elements? → 1296153440020652 |
---|
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.
Changed October 20, 2011 01:39PM UTC by comment:7
_comment0: | 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 → 1319118053804151 |
---|
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?
Changed November 13, 2011 05:29AM UTC by comment:8
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.
Changed May 29, 2012 03:59PM UTC by comment:9
_comment0: | 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}); \ }, \ ... \ }); \ \ \ }}} \ → 1338307393835642 |
---|
I met such problem too. I fix it after resize is finished. This is my workaround:
$("#somebox").resizable({ ..., stop: function() { var boxTop=$("#somebox").offset().top; var boxLeft=$("#somebox").offset().left; $("#somebox").css("position", "fixed"); $("#somebox").offset({top:boxTop,left:boxLeft}); }, ... });
Changed September 16, 2012 06:27PM UTC by comment:10
#8580 is a duplicate of this ticket.
Changed October 11, 2012 02:49PM UTC by comment:11
milestone: | 1.9.0 → 2.0.0 |
---|
Changed October 27, 2012 01:16AM UTC by comment:12
status: | new → open |
---|---|
summary: | resizable does not support position: fixed → 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).
Changed October 29, 2012 07:11PM UTC by comment:13
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.
Changed October 29, 2012 07:18PM UTC by comment:14
resolution: | → worksforme |
---|---|
status: | open → closed |
Based on that fiddle, this is working. Fixed position resizables break if the element is also draggable, see #6939.
Changed February 21, 2013 03:52PM UTC by comment:15
_comment0: | This is still broken. Please re-open. Here is a reduced test case and work around. \ \ Bug: \ http://jsfiddle.net/FfRRW/10/ \ Simply scroll down on the page and then try to resize the fixed element. It jumps position on the page during resize. \ \ Workaround: \ http://jsfiddle.net/FfRRW/11/ \ 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. → 1361462033670903 |
---|
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.
Changed February 21, 2013 04:00PM UTC by comment:16
@CodeTunnel: Upgrade to jQuery 1.9.1.
This is caused by the bugfix put in for #1749