CODEWITHSUNDEEP
jqueryjquery-ui-resizable
Goppie TOp
Goppie TOp

Reputation: 11

jQuery resizable plugin, to resize only height

How to make alsoResize option to only work for height but not for both width and height?

Upvotes: 1

Views: 2149

Answers (3)

Alen Delon
Alen Delon

Reputation: 1

Just go to the plugin code and put this:

if (this.className == 'YOUR_ELEM_CLASS_OR_ID_NAME_HERE') css = ['height'];

right after this:

_alsoResize = function (exp, c) {
            $(exp).each(function() {
                var el = $(this), start = $(this).data("resizable-alsoresize"), style = {}, 
                    css = c && c.length ? c : el.parents(ui.originalElement[0]).length ? ['width', 'height'] : ['width', 'height', 'top', 'left'];

Upvotes: 0

NeilC
NeilC

Reputation: 1390

I'm assuming that your base element that is resizable, can be resized in both the x & y axis. Using the alsoResize option will apply the same changes to the matching elements. I suggested you do not use the alsoResize option, but use the resize event handlers to apply the changes manually.

Upvotes: 0

Starx
Starx

Reputation: 79021

Actually if you set maxWidth to a limit, we cannot resize the width more than it.

For example, 

$( ".selector" ).resizable({ maxWidth: 250 }); //For initialzation

will not allow the resize to occur more that 250px in width

If you check this demo http://jqueryui.com/demos/resizable/#max-min, you will notice the width resizing being limited to a point.

So in your case set the initial width of the .selector and maxWidth same and it is done.

For further information go to http://jqueryui.com/demos/resizable/#option-maxWidth

Upvotes: 1

Related Questions