你好,我试过做等高的js代码,但不知何故对我不起作用。
这是我的js小提琴:jsfiddle
我想我遗漏了一些类的东西?提前感谢您的帮助
这是我的html:
// equal heights - plugin
;(function($) {
$.fn.equalHeights = function() {
var maxHeight = 0,
$this = $(this);
$this.each( function() {
var height = $(this).innerHeight();
if ( height > maxHeight ) { maxHeight = height; }
});
return $this.css('height', maxHeight);
};
})(jQuery);
$(document).ready(function(){
var equaliseMozaic = function(){
$('.jury-president__block').equalHeights();
console.log('reset');
};
// make mozaic blocks equal heights
if( $('.jury-president__block').length > 0 ){
// equalise mozaic blocks
equaliseMozaic();
// equalise mozaic blocks on resize
var throttledequaliseMozaic = _.throttle(equaliseMozaic, 500);
$(window).resize(throttledequaliseMozaic);
}
});
.jury-blocks{}
.jury-president__block{width:100px; display: inline-block; background-color:gray;}
.jury-president__block img {width:50px;}
<div class="jury-blocks">
<div class="jury-president__block grid-20">
<a href="">
<img src="http://placekitten.com/g/300/300" alt="">
</a>
<div class="jury-president__category"> Name<br>erwer</div>
<div class="jury-president__name"> Name, Juror Company</div>
</div>
<div class="jury-president__block grid-20">
<a href="">
<!--- <img src="http://placekitten.com/g/300/300" alt=""> --->
<img src="http://placekitten.com/g/300/300" alt="">
</a>
<div class="jury-president__category"> Name</div>
<div class="jury-president__name"> Name, Juror Company</div>
</div>
<div class="jury-president__block grid-20">
<a href="">
<!--- <img src="/assets/images/female-silhouette.jpg" alt=""> --->
<img src="http://placekitten.com/g/300/300" alt="">
</a>
<div class="jury-president__category"> Name</div>
<div class="jury-president__name"> Name, Company</div>
</div>
发布于 2015-01-16 19:39:09
添加这个似乎可以让它工作:.jury-blocks{display:flex;}
这个插件有你想要的行为吗?http://plnkr.co/edit/mPCw3Firht2lbdEMRCpn?p=preview如果没有,我可以再试一次。
此外,您的小提琴不包括jQuery或下划线,这两个似乎都是必要的。一旦我把它们包括在我的plunk中,高度是正确的,div只是不是所有的位置都正确。
发布于 2015-01-18 21:15:41
添加CSS
垂直对齐{
:表格;}.陪审团-总裁__块{显示:表格单元格;垂直对齐:顶部;}
不需要JS
https://stackoverflow.com/questions/27989883
复制