I am trying to resize a div with jquery and have the alsoResize trigger: I tried changing the width and then triggering the resize event, but it doesnt work.
fiddle: http://jsfiddle.net/Ns3yn/2/
Thanks!
3 Answers
This issue is an interesting one. My need required me to resize many "alsoResize" objects along with resizing the original object.
For one, it is a requested jQuery UI feature:
Resizable: Expose an API for programatically triggering a resize
But, until that is implemented, in lieu of creating this feature myself, I have found a pretty decent quick solution. The solution comes from here:
Programmatically Resize a resizable element
The solution uses some jquery unit testing libraries that simulate a mouse drag. You can find the necessary libraries here:
jquery.simulate.js
resizable_test_helpers.js
So include those two files above, then you can run code like this:
var handle = ".ui-resizable-se";
TestHelpers.resizable.drag(handle, 50, 50);
This will programatically resize your object by 50 pixels right and down.
1 Comment
Grégory
I think it's actually the best solution for unit testing resizable event.
Because nowhere says that the resizable plugin use the resize event to trigger changes. All you need is add .add('img') after window selector to have the expected result
1 Comment
chacham15
thats not the point, the point is seperating the code which resizes all the subelements and the code that resizes the whole
.trigger("resize") doesn't actually trigger the resize event.
If you bind explicitly to the event you'll see this...
$(".window").bind("resize", function(){
alert("resize event");
});
1 Comment
chacham15
seems that you're incorrect: jsfiddle.net/Ns3yn/7 To be more specific, as I read in the doc: divs can still receive the event if they are manually triggered.
width()function not fire a resize event ? i would have thought it should work without thetrigger('resize')?