Question

我知道这已被问了几次，我从这里提出的一个问题中得到了解决方案。它在页面加载时效果很好，但我无法工作的是窗口大小调整。 div保持相同的高度，导致内容溢出。

$(document).ready(function(){

  function setboxHeight(){
    var box1height = $('.box1').height();
    var box2height = $('.box2').height();    
    box1height>box2height ? ($('.box2').height(box1height)):($('.box1').height(box2height));    
  }

    setboxHeight();

  $(window).resize(function(){
    setboxHeight();
  });

});

这是小提琴：http://jsfiddle.net/fbthuemc/

Answer 1

我认为这就是你所追求的目标。

http://jsfiddle.net/7r1ekt9x/

$(document).ready(function() {
  function setboxHeight() {
    // Get the height of box1
    var box1height = $('.box1').height();
    // Set box2 height equal to box1
    $('.box2').height(box1height)
  }

  setboxHeight();

  $(window).resize(function() {
    setboxHeight();
  });
});

Answer 2

我可以问这是你想要的吗？

function setboxHeight(){
        $('.box1, .box2').css('height', '');
        ...
  }

现在它看起来可以在调整窗口大小时重置box1的高度。 http://jsfiddle.net/fbthuemc/3/

顺便说一句，我通常会使用console.log()来观察元素＆＃39;身高等等。

Answer 3

不确定你想做什么。避免溢出？如果是这样，您可以设置它们的overflow: hidden。或者显示y滚动条overflow-y: auto; overflow-x: hidden;（或反向）。

您也可以将height: 100% !important;设置为强制它。您还可以使用：word-wrap: break-word;来避免单词超出保证金。

您可以做的其他事情是设置min-height和/或max-height，以免意外出现意外问题。

希望有所帮助！

jQuery：在窗口调整大小时使两个div具有相同的高度

3 个答案: