Không giữ tỷ lệ khung hình với jQuery có thể thay đổi kích thước trong khi giữ phím shift

Question

Tôi đang định lại kích thước div với jQuery có thể thay đổi kích cỡ và tôi chỉ muốn thay đổi kích thước chiều cao của nó.

tôi quản lý để chỉ thay đổi kích thước khi kéo helper đáy:

$('div').resizable({ 
    handles: 's', 
}); 

Nhưng nếu tôi giữ phím shift, chiều rộng đang thay đổi. Xem http://jsfiddle.net/6p20qjmr/3/

Làm cách nào để tắt hành vi này?

Chỉnh sửa: Chiều rộng vùng chứa div có thể thay đổi sau cuộc gọi có thể thay đổi kích thước ban đầu.

Answer 1

Tôi tìm thấy một cách để đạt được những gì tôi muốn sử dụng resize tham số và reseting chiều rộng sau mỗi sự kiện thay đổi kích thước:

$(".resize").resizable({ 
    handles: 's', 
    resize: function() { 
     $(this).css('width', ''); 
    } 
}); 

Xem http://jsfiddle.net/6p20qjmr/4/

Answer 2

$(function() { 
    var $elt = $(".resize"); 
    var width = $elt.width(); 
    $elt.resizable({ 
     handles: 's', 
     maxWidth: width, 
     minWidth: width 
    }); 
}); 

Điều này có thể không phải là giải pháp tốt nhất, nhưng tôi không phải là siêu quen thuộc với chức năng thay đổi kích thước JQuery UI của. Tôi thậm chí không chắc chắn tại sao giữ thay đổi thay đổi chức năng. Nếu bạn có thể giải thích điều đó, tôi có thể cung cấp một giải pháp tốt hơn có vẻ ít hacky hơn.

Fiddle: http://jsfiddle.net/6p20qjmr/