library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Draggable: Fix border containment. Fixed #5569 - Draggable: Containment incorrectly calculates padding and border

Browse Source
This commit is contained in:
TJ VanToll 2013-01-26 15:31:27 -05:00
parent 5b2da7c127
commit 6358695df1
2 changed files with 33 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
tests/unit/draggable/draggable_options.js
View File

@ -346,6 +346,37 @@ test( "{ containment: 'parent' }, absolute", function() {
deepEqual( offsetAfter, expected, "compare offset to parent" ); deepEqual( offsetAfter, expected, "compare offset to parent" );
}); });
test( "containment, account for border", function() {
expect( 2 );
var el = $("#draggable1").appendTo("#main"),
parent = el.parent().css({
height: "100px",
width: "100px",
borderStyle: "solid",
borderWidth: "5px 10px 15px 20px"
}),
parentBottom = parent.offset().top + parent.outerHeight(),
parentRight = parent.offset().left + parent.outerWidth(),
parentBorderBottom = TestHelpers.draggable.border( parent, "bottom" ),
parentBorderRight = TestHelpers.draggable.border( parent, "right" );
el.css({
height: "5px",
width: "5px"
}).draggable({ containment: "parent" });
el.simulate( "drag", {
dx: 100,
dy: 100
});
equal( el.offset().top, parentBottom - parentBorderBottom - el.height(),
"The draggable should be on top of its parent's bottom border" );
equal( el.offset().left, parentRight - parentBorderRight - el.width(),
"The draggable should be to the right of its parent's right border" );
});
test( "containment, default, switching after initialization", function() { test( "containment, default, switching after initialization", function() {
expect( 2 ); expect( 2 );

4
ui/jquery.ui.draggable.js vendored
View File

@ -421,8 +421,8 @@ $.widget("ui.draggable", $.ui.mouse, {
this.containment = [ this.containment = [
(parseInt($(ce).css("borderLeftWidth"),10) || 0) + (parseInt($(ce).css("paddingLeft"),10) || 0), (parseInt($(ce).css("borderLeftWidth"),10) || 0) + (parseInt($(ce).css("paddingLeft"),10) || 0),
(parseInt($(ce).css("borderTopWidth"),10) || 0) + (parseInt($(ce).css("paddingTop"),10) || 0), (parseInt($(ce).css("borderTopWidth"),10) || 0) + (parseInt($(ce).css("paddingTop"),10) || 0),
(over ? Math.max(ce.scrollWidth,ce.offsetWidth) : ce.offsetWidth) - (parseInt($(ce).css("borderLeftWidth"),10) || 0) - (parseInt($(ce).css("paddingRight"),10) || 0) - this.helperProportions.width - this.margins.left - this.margins.right, (over ? Math.max(ce.scrollWidth,ce.offsetWidth) : ce.offsetWidth) - (parseInt($(ce).css("borderRightWidth"),10) || 0) - (parseInt($(ce).css("paddingRight"),10) || 0) - this.helperProportions.width - this.margins.left - this.margins.right,
(over ? Math.max(ce.scrollHeight,ce.offsetHeight) : ce.offsetHeight) - (parseInt($(ce).css("borderTopWidth"),10) || 0) - (parseInt($(ce).css("paddingBottom"),10) || 0) - this.helperProportions.height - this.margins.top - this.margins.bottom (over ? Math.max(ce.scrollHeight,ce.offsetHeight) : ce.offsetHeight) - (parseInt($(ce).css("borderBottomWidth"),10) || 0) - (parseInt($(ce).css("paddingBottom"),10) || 0) - this.helperProportions.height - this.margins.top - this.margins.bottom
]; ];
this.relative_container = c; this.relative_container = c;