这是相关链接。刷新页面时会出现此问题。通常从浏览器或缓存加载页面似乎没问题。不知道为什么会这样。任何人都可以帮忙解释一下吗?任何帮助,将不胜感激。代码如下:
(function($) {
$.fn.equalHeights = function(minHeight, maxHeight) {
column1 = 0;
column2 = 0;
column3 = 0;
//FIND THE TOTAL HEIGHT OF EACH COLUMN BY ADDING UP EACH WIDGET, SORTING BY UNIQUE COLUMN CLASS
this.each(function() {
if($(this).hasClass('column1')) {
column1 = column1 + $(this).height();
} else if($(this).hasClass('column2')) {
column2 = column2 + $(this).height();
} else if($(this).hasClass('column3')) {
column3 = column3 + $(this).height();
}
});
//alert(column1);
//alert(column2);
//alert(column3);
//FIND THE TALLEST COLUMN
tallest = Math.max(column1, column2, column3);
//alert(tallest);
//SIMPLE MATH TO DETERMINE HOW MUCH HEIGHT TO MAKE THE LAST WIDGET OF EACH COLUMN SO THEY LINE UP NICE AND NEAT
column1 = tallest - column1 + $('#left_sidebar .widget').last().height();
column2 = tallest - column2 + $('#center_sidebar .widget').last().height();
column3 = tallest - column3 + $('#right_sidebar .widget').last().height();
//alert('Add how much to Column 1: ' + column1);
//alert('Add how much to Column 2: ' + column2);
//alert('Add how much to Column 3: ' + column3);
//alert('Left' + $('#left_sidebar .widget').last().css('height'));
//alert('Center' + $('#center_sidebar .widget').last().css('height'));
//alert('Right' + $('#right_sidebar .widget').last().css('height'));
if(column1 != '0px') {
$('#left_sidebar .widget').last().css('height', column1 + 'px');
}
if(column2 != '0px') {
$('#center_sidebar .widget').last().css('height', column2 + 'px');
}
if(column3 != '0px') {
$('#right_sidebar .widget').last().css('height', column3 + 'px');
}
}
})(jQuery);
答案 0 :(得分:4)
只是出于好奇,你能不能将宽度和高度属性添加到“TMLA你是否在这里”的图像中。当应用equalHeight时,我有时会遇到这个问题...取决于图像是否加载,相等高度将无法获得正确的高度......实际上它是正确的高度但不是你期望的。 / p>
所以我的猜测是应用了equalHeights,然后加载了这个图像,这就是为什么你在第一列上有大约166px的原因。
你没有在其他列上看到这个,因为所有图像都有宽度和高度属性!
仅供参考:将相同高度设置为列的最简单方法来自Paul Irish。抱歉找不到原帖,所以这是代码。
$.fn.setAllToMaxHeight = function(){
return this.height( Math.max.apply(this, $.map( this , function(e){ return $(e).height() }) ) );
}
用法
$('.selector').setAllToMaxHeight();