Skip to main content

Search and Top Navigation

#6181 closed bug (fixed)

Opened October 14, 2010 09:48AM UTC

Closed December 01, 2010 08:34PM UTC

Last modified October 11, 2012 09:15PM UTC

Draggable: issue with containment on position:fixed elements

Reported by: gethinw Owned by:
Priority: minor Milestone:
Component: ui.draggable Version: 1.8.5
Keywords: Cc:
Blocked by: Blocking:
Description

If an element is position:fixed and made draggable with containment:'window' the containment isn't applied correctly when the page is scrolled.

See http://jsfiddle.net/JVn7P/

Attachments (0)
Change History (5)

Changed December 01, 2010 01:42AM UTC by jfremy comment:1

The following fix did it for me (I did not test thoroughly).

In _setContainment, use the following code:

if(o.containment == 'document' || o.containment == 'window') this.containment = [
	o.containment == 'document' ? 0 : $(window).scrollLeft() - this.offset.relative.left - this.offset.parent.left,
	o.containment == 'document' ? 0 : $(window).scrollTop() - this.offset.relative.top - this.offset.parent.top,
	o.containment == 'document' ? 0 : $(window).scrollLeft() + $(o.containment == 'document' ? document : window).width() - this.helperProportions.width - this.margins.left,
	o.containment == 'document' ? 0 : $(window).scrollTop() + ($(o.containment == 'document' ? document : window).height() || document.body.parentNode.scrollHeight) - this.helperProportions.height - this.margins.top
];

When containment is "window", use scrollTop and scrollLeft to shift the containment window accordingly.

The problem also manifests itself with position:absolute.

If you take the fiddle sample and switch from fixed to absolute, then if you move the block down, then scroll and then try to move the block again, it will jump up.

Changed December 01, 2010 06:28AM UTC by jfremy comment:2

Changed December 01, 2010 08:34PM UTC by scottgonzalez comment:3

summary: issue with draggable containment on position:fixed elementsDraggable: issue with containment on position:fixed elements

Changed December 01, 2010 08:34PM UTC by Jean-Francois Remy comment:4

resolution: → fixed
status: newclosed

Draggable: Handle scrolled windows. Fixes #6181 - Draggable: issue with containment on position:fixed elements.

Changeset: e01664a3820c185636a3fe7099e93e68091d24fd

Changed October 11, 2012 09:15PM UTC by scottgonzalez comment:5

milestone: TBD

Milestone TBD deleted