JQuery UI resizable - триггер события на minWidth, maxWidth, minHeight, maxHeight превышен

Я не могу найти событие, которое замечает меня, когда min/max пределы достигнуты или превышены в документации API.

Есть ли возможность сделать это, не проверяя лимиты самостоятельно?

1 ответ

Насколько я знаю, ваш единственный вариант - вручную проверить, достигнуты ли min/max пределы. Вы можете использовать свойство size объекта ui переданного для обратного вызова события изменения размера, для доступа к текущей ширине и высоте и метода option для доступа к значениям min и max.

$(function () {
 $("#resizable").resizable({
 minWidth: 50,
 minHeight: 50,
 maxWidth: 250,
 maxHeight: 200,
 resize: function (event, ui) {
 var $elm = ui.element;
 if (ui.size.width <= $elm.resizable("option", "minWidth"))
 console.log("Reached Min Width!");

 if (ui.size.height <= $elm.resizable("option", "minHeight"))
 console.log("Reached Min Height!");

 if (ui.size.width >= $elm.resizable("option", "maxWidth"))
 console.log("Reached Max Width!");

 if (ui.size.height >= $elm.resizable("option", "maxHeight"))
 console.log("Reached Max Height!");
 }
 });
});
#resizable {
 width:100px;
 background:dogerblue;
}
<div id="resizable">
 <h3>Resizable</h3>
</div>

Во всяком случае, было бы неплохо иметь этот параметр: я создал Feature Request @jQuery ui.

licensed under cc by-sa 3.0 with attribution.