mirror of
https://github.com/jquery/jquery-ui.git
synced 2024-11-21 11:04:24 +00:00
Draggable: Added appendTo option.
This commit is contained in:
parent
91bf052d81
commit
7236f2935a
37
ui/jquery.ui.draggable.js
vendored
37
ui/jquery.ui.draggable.js
vendored
@ -19,6 +19,7 @@ $.widget( "ui.draggable", $.ui.interaction, {
|
|||||||
widgetEventPrefix: "drag",
|
widgetEventPrefix: "drag",
|
||||||
|
|
||||||
options: {
|
options: {
|
||||||
|
appendTo: null,
|
||||||
handle: null,
|
handle: null,
|
||||||
helper: null
|
helper: null
|
||||||
},
|
},
|
||||||
@ -32,6 +33,8 @@ $.widget( "ui.draggable", $.ui.interaction, {
|
|||||||
// tempPosition: overridable CSS position of dragEl
|
// tempPosition: overridable CSS position of dragEl
|
||||||
// overflowOffset: offset of scroll parent
|
// overflowOffset: offset of scroll parent
|
||||||
// overflow: object containing width and height keys of scroll parent
|
// overflow: object containing width and height keys of scroll parent
|
||||||
|
// domPosition: object containing original parent and index when using
|
||||||
|
// appendTo option without a helper
|
||||||
|
|
||||||
_create: function() {
|
_create: function() {
|
||||||
this._super();
|
this._super();
|
||||||
@ -48,11 +51,26 @@ $.widget( "ui.draggable", $.ui.interaction, {
|
|||||||
},
|
},
|
||||||
|
|
||||||
_start: function( event, pointerPosition ) {
|
_start: function( event, pointerPosition ) {
|
||||||
|
var offset;
|
||||||
|
|
||||||
// The actual dragging element, should always be a jQuery object
|
// The actual dragging element, should always be a jQuery object
|
||||||
this.dragEl = this.options.helper ?
|
this.dragEl = this.options.helper ?
|
||||||
this._createHelper( pointerPosition ) :
|
this._createHelper( pointerPosition ) :
|
||||||
this.element;
|
this.element;
|
||||||
|
|
||||||
|
// _createHelper() ensures that helpers are in the correct position
|
||||||
|
// in the DOM, but we need to handle appendTo when there is no helper
|
||||||
|
if ( this.options.appendTo && this.dragEl === this.element ) {
|
||||||
|
this.domPosition = {
|
||||||
|
parent: this.element.parent(),
|
||||||
|
index: this.element.index()
|
||||||
|
};
|
||||||
|
offset = this.dragEl.offset();
|
||||||
|
this.dragEl
|
||||||
|
.appendTo( this.options.appendTo )
|
||||||
|
.offset( offset );
|
||||||
|
}
|
||||||
|
|
||||||
this.cssPosition = this.dragEl.css( "position" );
|
this.cssPosition = this.dragEl.css( "position" );
|
||||||
this.scrollParent = this.element.scrollParent();
|
this.scrollParent = this.element.scrollParent();
|
||||||
|
|
||||||
@ -105,6 +123,8 @@ $.widget( "ui.draggable", $.ui.interaction, {
|
|||||||
},
|
},
|
||||||
|
|
||||||
_stop: function( event, pointerPosition ) {
|
_stop: function( event, pointerPosition ) {
|
||||||
|
var parent, next;
|
||||||
|
|
||||||
this._preparePosition( pointerPosition );
|
this._preparePosition( pointerPosition );
|
||||||
|
|
||||||
// If user cancels stop, leave helper there
|
// If user cancels stop, leave helper there
|
||||||
@ -112,6 +132,16 @@ $.widget( "ui.draggable", $.ui.interaction, {
|
|||||||
if ( this.options.helper ) {
|
if ( this.options.helper ) {
|
||||||
this.dragEl.remove();
|
this.dragEl.remove();
|
||||||
}
|
}
|
||||||
|
if ( this.domPosition ) {
|
||||||
|
parent = this.domPosition.parent;
|
||||||
|
next = parent.children().eq( this.domPosition.index );
|
||||||
|
if ( next.length ) {
|
||||||
|
next.before( this.element );
|
||||||
|
} else {
|
||||||
|
parent.append( this.element );
|
||||||
|
}
|
||||||
|
this.element.offset( this.offset );
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this._unblockFrames();
|
this._unblockFrames();
|
||||||
@ -137,11 +167,14 @@ $.widget( "ui.draggable", $.ui.interaction, {
|
|||||||
helper = $( this.options.helper() );
|
helper = $( this.options.helper() );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Ensure the helper is in the DOM; obey the appendTo option if it exists
|
||||||
|
if ( this.options.appendTo || !helper.closest( "body" ).length ) {
|
||||||
|
helper.appendTo( this.options.appendTo || this.document[0].body );
|
||||||
|
}
|
||||||
|
|
||||||
return helper
|
return helper
|
||||||
// Helper must be absolute to function properly
|
// Helper must be absolute to function properly
|
||||||
.css( "position", "absolute" )
|
.css( "position", "absolute" )
|
||||||
// TODO: add appendTo option
|
|
||||||
.appendTo( this.document[0].body )
|
|
||||||
.offset({
|
.offset({
|
||||||
left: pointerPosition.x - helper.outerWidth() * xPos,
|
left: pointerPosition.x - helper.outerWidth() * xPos,
|
||||||
top: pointerPosition.y - helper.outerHeight() * yPos
|
top: pointerPosition.y - helper.outerHeight() * yPos
|
||||||
|
Loading…
Reference in New Issue
Block a user