mirror of
https://github.com/jquery/jquery-ui.git
synced 2024-11-21 11:04:24 +00:00
Resizable: Fix resizing of elems with box-sizing: border-box
Fixes gh-1979 Closes gh-2012
This commit is contained in:
parent
5fa0db48d7
commit
62f2ccc567
@ -532,4 +532,30 @@ QUnit.test( "alsoResize + multiple selection", function( assert ) {
|
||||
assert.equal( other2.height(), 150, "alsoResize o2 constrained height at containment edge" );
|
||||
} );
|
||||
|
||||
QUnit.test( "alsoResize with box-sizing: border-box", function( assert ) {
|
||||
assert.expect( 4 );
|
||||
|
||||
var other = $( "<div>" )
|
||||
.css( {
|
||||
width: 50,
|
||||
height: 50,
|
||||
padding: 10,
|
||||
border: 5
|
||||
} )
|
||||
.appendTo( "body" ),
|
||||
element = $( "#resizable1" ).resizable( {
|
||||
alsoResize: other
|
||||
} ),
|
||||
handle = ".ui-resizable-se";
|
||||
|
||||
$( "*" ).css( "box-sizing", "border-box" );
|
||||
|
||||
testHelper.drag( handle, 80, 80 );
|
||||
|
||||
assert.equal( element.width(), 180, "resizable width" );
|
||||
assert.equal( parseFloat( other.css( "width" ) ), 130, "alsoResize width" );
|
||||
assert.equal( element.height(), 180, "resizable height" );
|
||||
assert.equal( parseFloat( other.css( "height" ) ), 130, "alsoResize height" );
|
||||
} );
|
||||
|
||||
} );
|
||||
|
@ -533,15 +533,18 @@ $.widget( "ui.resizable", $.ui.mouse, {
|
||||
if ( this.position.left !== this.prevPosition.left ) {
|
||||
props.left = this.position.left + "px";
|
||||
}
|
||||
|
||||
this.helper.css( props );
|
||||
|
||||
if ( this.size.width !== this.prevSize.width ) {
|
||||
props.width = this.size.width + "px";
|
||||
this.helper.width( props.width );
|
||||
}
|
||||
if ( this.size.height !== this.prevSize.height ) {
|
||||
props.height = this.size.height + "px";
|
||||
this.helper.height( props.height );
|
||||
}
|
||||
|
||||
this.helper.css( props );
|
||||
|
||||
return props;
|
||||
},
|
||||
|
||||
@ -1048,7 +1051,7 @@ $.ui.plugin.add( "resizable", "alsoResize", {
|
||||
$( o.alsoResize ).each( function() {
|
||||
var el = $( this );
|
||||
el.data( "ui-resizable-alsoresize", {
|
||||
width: parseFloat( el.width() ), height: parseFloat( el.height() ),
|
||||
width: parseFloat( el.css( "width" ) ), height: parseFloat( el.css( "height" ) ),
|
||||
left: parseFloat( el.css( "left" ) ), top: parseFloat( el.css( "top" ) )
|
||||
} );
|
||||
} );
|
||||
|
Loading…
Reference in New Issue
Block a user