jquery | 동적 div의 높이 변경

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에 모습을 가질 수 있습니다, 나는 거기에 몇 가지 로깅 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); 

를를 CH3OH