2016-02-03 4 views
0

Это страница Я работаю на http://bigislandnaturetours.com/tour/Отрегулируйте высоту столбца динамически

Этот вопрос я пытаюсь увеличить высоту в правой колонке, чтобы автоматически регулировать высоту в левой колонке. Я использую следующий JS, ниже которого я тестировал и работает на других сайтах, но не на этом. Что может быть неправильным?

function doResize() { 
    if ($(window).width() > 981) { 
     setTimeout(function() { 
      $(".leftpane").css("height", "auto"); 
      $(".midpanel").css("height", "auto"); 
      var heightLeft = $(".rightpane").height(); 
      var heightMiddle = $(".midpanel").height(); 
      var heightRight = $(".leftpane").height(); 

      if (heightRight > heightMiddle) { 

       $('.midpanel').css('min-height', heightRight + 2) 

      } else { 

       $('.leftpane').css('min-height', heightMiddle + 2) 
      } 

      heightMiddle = $(".midpanel").height(); 
      heightRight = $(".leftpane").height(); 

      if (heightLeft >= heightRight) { 
       $(".leftpane").css("height", heightLeft - 10); 
       $(".midpanel").css("height", heightLeft - 10); 
      } 

     }, 1000); 
    } 
} 


$(document).ready(function() { 
    doResize(); 
}); 


$(window).resize(function() { 
    doResize(); 
    if ($(window).width() < 561) { 
     $(".leftpane").css("min-height", "auto"); 
     $(".midpanel").css("min-height", "auto"); 
    } 
    $('.main-nav li').unbind("click"); 
    if ($('.rightpane').css('display') == 'none') { 
     $('.main-nav li').bind("click", function() { 
      $(this).addClass('im-curent'); 
      $("ul", this).toggle(100); 
     }); 
    } 

}); 

ответ

0

Самый простой ответ заключается в использовании гибкого коробками CSS (HTML5/CSS3) или, для старых браузеров, таблицу, используемую в режиме «презентации».

Оба должны автоматически поддерживать высоту столбца в синхронизации.

Смежные вопросы