瀏覽器調整大小條件並不總是正確觸發

Question

當調整瀏覽器，我有一個簡單的函數，檢查窗口比以影響佈局，其中有一部分是：

if (jQ(window).width() > ($elemH*2)) /* Target widest settings */ { 
    $body.addClass('wide').removeClass('tall'); 
    $elemW = ($elemH*2); 
    productWideSize(); 

上述工程完美，0問題（我已經將其僅包含在上下文中）。這個問題似乎在於productWideSize()，這是如下：

function productWideSize(){ 
    $info = jQ('#productInfo'); 
    $infoH = jQ('#productInfo').outerHeight(); 
    $maxH = (jQ('#product-form').height()-120); 
    if ($infoH < $maxH) /* Check if element height is LT available space */ { 
     $info.removeClass('scroll').css({ 
      'margin-top' : '-' + $infoH/2 + 'px' 
     }) 
    } else { 
     $info.addClass('scroll').css({ 
      'margin-top' : '', 
     }) 
    }; 
}; 

時，請認真調整瀏覽器，它工作得很好;但是如果突然發生瀏覽器大小的變化，通常if/else部分之間的轉換不會觸發。經過Chrome和Firefox測試。

很明顯，代碼「起作用」，但它並不特別健壯。我仍然對編碼感興趣，並想知道我是否採用了一些根本不好的做法。有什麼建議麼？

Answer 1

看起來好像問題是在引用條件之前緩存值。將其更改爲以下作品：

function productWideSize(){ 
    $info = jQ('#productInfo'); 
    if (jQ('#productInfo').outerHeight() < jQ('#product-form').height()-120) { 
     $info.removeClass('scroll').css({ 
      'margin-top' : '-' + jQ('#productInfo').outerHeight()/2 + 'px' 
     }) 
    } else { 
     $info.addClass('scroll').css({ 
      'margin-top' : '', 
     }) 
    } 
};