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 Packages Projects Releases Wiki Activity

Resizable: containment now works with non - immediate children

Browse Source 
Fixes #7485
Closes gh-1130
This commit is contained in:
Jyoti Deka 2013-11-07 09:39:51 -05:00 committed by Mike Sherov
parent 38c6cf1382
commit c03cb8079c
3 changed files with 38 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
tests/unit/resizable/resizable.html
View File

@ -44,6 +44,22 @@
height: 100px;
width: 100px;
}
#container2 {
position: relative;
width: 400px;
height: 400px;
margin: 30px 0 0 30px;
}
#parent {
position: relative;
width: 300px;
height: 300px;
}
#child {
position: relative;
width: 100px;
height: 100px;
}
</style>
</head>
<body>
@ -58,6 +74,12 @@
<div id="container">
<div id="resizable1">I'm a resizable.</div>
</div>
<div id="container2">
<div id="parent">
<div id="child">I'm a resizable.</div>
</div>
</div>
<img src="images/test.jpg" id="resizable2" alt="solid gray">
</div>

15
tests/unit/resizable/resizable_options.js
View File

@ -124,7 +124,7 @@ test("aspectRatio: 'preserve' (ne)", function() {
});
test( "containment", function() {
expect( 4 );
expect( 6 );
var element = $( "#resizable1" ).resizable({
containment: "#container"
});
@ -136,6 +136,19 @@ test( "containment", function() {
TestHelpers.resizable.drag( ".ui-resizable-se", 400, 400 );
equal( element.width(), 300, "constrained width at containment edge" );
equal( element.height(), 200, "constrained height at containment edge" );
// http://bugs.jqueryui.com/ticket/7485 - Resizable: Containment calculation is wrong
// when containment element is not the immediate parent
element = $( "#child" ).resizable({
containment: "#container2",
handles: "all"
});
TestHelpers.resizable.drag( ".ui-resizable-e", 300, 0 );
equal( element.width(), 400, "element able to resize itself to max allowable width within container" );
TestHelpers.resizable.drag( ".ui-resizable-s", 0, 300 );
equal( element.height(), 400, "element able to resize itself to max allowable height within container" );
});
test("grid", function() {

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

@ -792,8 +792,8 @@ $.ui.plugin.add("resizable", "containment", {
that.offset.left = that.parentData.left+that.position.left;
that.offset.top = that.parentData.top+that.position.top;
woset = Math.abs( (that._helper ? that.offset.left - cop.left : (that.offset.left - cop.left)) + that.sizeDiff.width );
hoset = Math.abs( (that._helper ? that.offset.top - cop.top : (that.offset.top - co.top)) + that.sizeDiff.height );
woset = Math.abs( ( that._helper ? that.offset.left - cop.left : ( that.offset.left - co.left ) ) + that.sizeDiff.width );
hoset = Math.abs( ( that._helper ? that.offset.top - cop.top : ( that.offset.top - co.top ) ) + that.sizeDiff.height );
isParent = that.containerElement.get(0) === that.element.parent().get(0);
isOffsetRelative = /relative|absolute/.test(that.containerElement.css("position"));