From 3974b55ba5078799df818c78d9273e11d9796ff3 Mon Sep 17 00:00:00 2001 From: Ethan Romba Date: Tue, 10 Jul 2012 01:02:25 -0700 Subject: Resizable: Update CSS dimensions selectively. Fixes #7605 - Setting width and height when only one is changing Resizable: Trigger resize event only when element is resized. Fixes #5545 - Callbacks ignore the grid. Resizable: Added event tests. Fixes #5817 - resize event reports unconstrained ui.size --- ui/jquery.ui.resizable.js | 33 +++++++++++++++++++++++---------- 1 file changed, 23 insertions(+), 10 deletions(-) (limited to 'ui/jquery.ui.resizable.js') diff --git a/ui/jquery.ui.resizable.js b/ui/jquery.ui.resizable.js index fba9216e1..a27a140b2 100644 --- a/ui/jquery.ui.resizable.js +++ b/ui/jquery.ui.resizable.js @@ -286,8 +286,10 @@ $.widget("ui.resizable", $.ui.mouse, { _mouseDrag: function(event) { //Increase performance, avoid regex - var el = this.helper, - smp = this.originalMousePosition, a = this.axis; + var el = this.helper, props = {}, + smp = this.originalMousePosition, a = this.axis, + prevTop = this.position.top, prevLeft = this.position.left, + prevWidth = this.size.width, prevHeight = this.size.height; var dx = (event.pageX-smp.left)||0, dy = (event.pageY-smp.top)||0; var trigger = this._change[a]; @@ -303,21 +305,32 @@ $.widget("ui.resizable", $.ui.mouse, { data = this._respectSize(data, event); + this._updateCache(data); + // plugins callbacks need to be called first this._propagate("resize", event); - el.css({ - top: this.position.top + "px", left: this.position.left + "px", - width: this.size.width + "px", height: this.size.height + "px" - }); + if (this.position.top !== prevTop) { + props.top = this.position.top + "px"; + } + if (this.position.left !== prevLeft) { + props.left = this.position.left + "px"; + } + if (this.size.width !== prevWidth) { + props.width = this.size.width + "px"; + } + if (this.size.height !== prevHeight) { + props.height = this.size.height + "px"; + } + el.css(props); if (!this._helper && this._proportionallyResizeElements.length) this._proportionallyResize(); - this._updateCache(data); - - // calling the user callback at the end - this._trigger('resize', event, this.ui()); + // Call the user callback if the element was resized + if ( ! $.isEmptyObject(props) ) { + this._trigger('resize', event, this.ui()); + } return false; }, -- cgit v1.2.3