Question

基本上我们有一个商店类别导航，分为3个级别。我们需要做的就是让UL的高度至少达到其孩子的高度。

所以说例如 #nav ul 是600px， #nav ul ul 会自动变成至少600px。但是，如果 #nav ul ul ul 是750px那么它需要能够达到那么高，而不是限制在600px。

我们可以得到它，如果父亲是600px，所有孩子都设置为.xight 600px，但你怎么做这个最小高度？

请参阅链接，例如：

正如你所看到的那样，第二级调整到父级的高度，但是第三级被限制为该长度，因为js设置高度，而不是min-height

谢谢，麦克

Answer 1

只需使用.css('min-height', someHeight)代替.height(someHeight)

Answer 2

我无法理解你想要什么，但我能做我能做的事;）

$(document).ready( function() {
var i1 = 600;
var i2 = $("#nav ul ul").height();
var i3 = $("#nav ul ul ul").height();
if(i2 >= i1) {
$("#nav ul ul").css({ 'min-height':'600px' });
}
if(i3 >= i1) {
$("#nav ul ul ul").css({ 'min-height':'600px' });
}
});

没有downvoting啊如果错了

Answer 3

这是你在找什么？ DEMO

$(document).ready(function(){
    $('ul').hover(function(){
         $('ul').setAllToMaxHeight();
    });
});

Answer 4

您无法检索隐藏元素的尺寸。结果将是高度和宽度为零。您可以使用css在屏幕外设置子UL位置，而不是隐藏它们：

 ul ul {position: absolute; left: 80px; top: -999em}
 ul li:hover > ul {top:0;}

由于它们未被隐藏，因此setAllToMaxHeight()方法有效

DEMO：http://jsfiddle.net/bzsM9/18/

根据父高度设置UL最小高度

4 个答案: