Почему jquery-ui resizable присваивает ширину div с помощью «alsoResize»?

Question

У меня есть набор дивы вроде этого:

<div id="body_container"> 
    <div id="top_body"> 
    </div> 
    <div id="bottom_body"> 
    </div> 
</div> 

Я также имею эту функцию:

$(function() { 
    $("#top_body").resizable({handles: "s", 
    alsoResize: "#bottom_body"}); 
}); 

изменение размера работа, но сразу же после начала действия для изменения размера, #bottom_body назначенных фиксированную шириной (равной его ширине в начале действия изменения размера). Через css оба значения #top_body и #bottom_body имеют ширину 100%. Я хочу, чтобы он остался таким.

Есть ли способ предотвратить назначение ширины? Я хочу, чтобы ширина была адаптирована к размеру окна, но с моей текущей проблемой назначение ширины фиксирует нижний div (но не верхний), нарушая мой интерфейс.

Я ищу, в идеале, решения, которые не требуют использования JS-обработчиков, чтобы заставить ширину вернуться на 100% всякий раз, когда я использую изменяемую размер ручку.

Answer 1

Это, кажется, работает отлично

$(window).on('resize', function() { 
    $('#bottom_body').css({width: '100%'}); 
}); 

Это будет работать только тогда, когда окно ширина/высота изменяется, не изменяя/изменение размеров высоты ваших двух дивы, так как не нужно работать тогда.