Пользовательский интерфейс JQuery: есть ли способ сделать высоту изменяемого размера div больше, когда его ширина становится меньше?

Question

У меня есть 2 div (myDiv1 и myDiv2), которые находятся в другом div (otherDiv), который в конечном итоге находится внутри asp: TabPanel.Я использую функцию изменения размера JQuery IU (которую можно увидеть здесь: http://jqueryui.com/demos/resizable/) на myDiv1. Размер myDiv1 можно изменить только по ширине. Моя дилемма заключается в том, что высота элемента div не изменяется при уменьшении ширины и проливе содержимоговнизу.

<script type="text/javascript" language="javascript">
     $(document).ready(function () {
        $('#myDiv1').resizable({ handles: 'e' });
    });
 </script>

 <asp:TabPanel>
     <div id="otherDiv">
         <div id="myDiv1">
             ... Some Stuff ...
         </div>
         <div id="myDiv2">
             ... Some Other Stuff ...
         </div>
     </div>
 </asp:TabPanel>

У кого-нибудь есть предложения?

Answer 1

Событие resize можно использовать для выполнения собственного кода всякий раз, когда пользователь изменяет размер элемента.Отсюда вы можете рассчитать ширину и изменить высоту.

$("something").resizable({
    // ...
    resize: function(event, ui){
        // do stuff here
    },
    // ...
});