Hello everyone,
I'm a newbie in jQuery and have difficulties with setting up the
containtment option in draggable.
I have seen this other post (http://groups.google.com/group/jquery-ui/
browse_thread/thread/8a1672d47767f4a2) but it did not help at all.
Perhaps, my implementation has some essential difference.
I have a jQuery UI dialog widget implemented with draggable enabled.
Now, what I need to do is to restrict the dragging effect of the
dialog so that it is only possible to drag it around within the
browser internal frame borders.
Now, as I understand, this should work like this:
dBox.dialog({
modal: true,
draggable:true,
stack:true,
zIndex:1000
}).draggable({ containment: 'window' });
yet it doesn't...
I made it work by modifying the jQuery UI core, and adding
containment:'window' as a default option value in _makeDraggable
method of a dialog widget:
_makeDraggable: function() {
var self = this,
options = this.options;
this.uiDialog.draggable({
cancel: '.ui-dialog-content',
helper: options.dragHelper,
containment: 'window', // my implementation
handle: '.ui-dialog-titlebar',
start: function() {
self._moveToTop();
(options.dragStart &&
options.dragStart.apply(self.element[0],
arguments));
},
drag: function() {
(options.drag &&
options.drag.apply(self.element[0], arguments));
},
stop: function() {
(options.dragStop &&
options.dragStop.apply(self.element[0],
arguments));
$.ui.dialog.overlay.resize();
}
});
},...
however this doesn't really resolve the problem, because it'll be a
headache if I want to reuse this bundle and have alternative settings.
so, what I need is an advice how to access and reset this containtment
option value from a dialog object instance (perhaps there is an
alternative syntaxis I can use, but as I said, I've tried many things
including the proposal from another google.groups post, it didn't work)
