jquery | Изменение высоты divs динамически onresize

Question

У меня проблема с моей функцией, которая вычисляет высоту каждой секции div при изменении размера страницы. Он показывает мне такое же значение высоты после повторной установки. Но все в порядке при загрузке первой страницы. Где проблема?

JS

$(document).ready(function() { 
    $(window).bind('orientationchange resize', function(e){ 
     resize(); 
    }).trigger('resize'); 
}); 

function resize() { 
    var vph  = $(window).height(); 

    $.each($('.st-panel'), function(index, value) { 
     var section_height = $(this).height() < vph ? vph : $(this).height(); 
     $(this).height(section_height); 
    }); 
} 

HTML

<section class="st-panel" id="st-panel-1">...long text here...</section> 
<section class="st-panel" id="st-panel-2">...long text here...</section> 
<section class="st-panel" id="st-panel-3">...long text here...</section> 
<section class="st-panel" id="st-panel-4">...long text here...</section> 
<section class="st-panel" id="st-panel-5">...long text here...</section> 

Answer 1

Я думаю, что может быть проблема с вами бизнес-логики. Когда размер видового экрана увеличивается, ваши разделы также увеличиваются. Впоследствии, когда это уменьшилось, высоты разделов всегда будут больше размера видового экрана, поэтому изменение размера не происходит.

Возможно, я ошибаюсь, но вам нужно указать, что вы пытаетесь достичь, чтобы понять, что именно сломано.

Вы можете посмотреть на этой jsfiddle, я addded некоторые протоколирование там http://jsfiddle.net/q8sp2jzy/

console.log('Section height: '+ $(this).height()); 
console.log('Viewport: ' + vph); 
var section_height = $(this).height() < vph ? vph : $(this).height(); 
$(this).height(section_height);