等高列与jQuery不工作

Equal height columns with jQuery not working?

本文关键字:工作 jQuery 高列      更新时间:2023-09-26

我尝试了许多方法来获得相等的列,但没有一种对我有效。我已经尝试了jQuery插件的每一个变体,我可以找到不同的调用使用文档准备和窗口加载,在头部和身体结束之前…就是运气不好……侧边栏将无法继续满足我的内容。

我已经创建了一个小提琴与我的最新镜头(这是这个方法:http://www.outsidethebracket.com/equal-height-columns/),但我准备改变到任何方法将工作。

http://jsfiddle.net/7WraW/

$(window).load(function(){
$("#sidebar").height(Math.max($("#content").height(),$("#sidebar").height()));
})

感谢您的帮助!

如果您使用$(document).ready而不是$(window).load,则可以正常工作:

$(document).ready(function () {
    var hgt = Math.max($("#content").height(), $("#sidebar").height());
    $("#sidebar,#content").height(hgt);
});
http://jsfiddle.net/mblase75/7WraW/5/

试试这个…

$(document).ready( function() {
  var contentHeight = $('#content').height();
  $('#sidebar').css('height', contentHeight + "px");
});

有一个jQuery插件来平衡元素的高度或宽度,它比这个好得多,有更多的实用程序来完成这个任务,而且非常容易使用:

http://tsvensen.github.io/equalize.js/

希望这有帮助,快乐的编码:)

下面是使用jquery实现等高列的简单解决方案:

$(window).load(function(){
    $("#left_side").height($("#right_side").height());
});
http://jsbin.com/iyirel/1/watch