Два div, которые находятся напротив друг друга

Question

Я хочу сделать два div по размеру по вертикали. например,

Верхняя высота div 400px, а нижняя высота div равна 200. Когда я изменяю размер нижнего div 250px, верхняя высота div должна быть 350px.

Я с помощью JQuery UI изменяемыми:

Fiddle here

 $(document).ready(function() { 
 
      $(".dv-bottom").resizable({ 
 
      handles: { 
 
       'n': '.handle' 
 
      } 
 
      }).on("resize", function(event, ui) { 
 
      $('.dv-bottom').height(600 - ui.size.height); 
 
      $('.dv-top').css({ 
 
       top: '0' 
 
      });; 
 
      }); 
 
     });

<div class="dv-top"> 
 
</div> 
 
<div class="dv-bottom"> 
 
    <div class="ui-resizable-handle ui-resizable-n handle"></div> 
 

 
    <div class=" pane-content"> 
 

 
    </div> 
 

 
</div>

Answer 1

ли что-то подобное на изменение размера:

hBottom = ui.size.height 
$('.dv-bottom').height(hBottom).css('top',0); 
hTop = 600 - hBottom; 
$('.dv-top').height(hTop); 

демо: https://jsfiddle.net/ofem40cf/