Question

这是我正在努力的网站，请原谅我，如果我不够具体，我是新手。

http://daniel.grocock.me/portnew

设置#introexpand div的段落高度并具有调整大小的功能在浏览器调整大小时检查#introexpand是否需要适合更大或更小的区域。

function resize() {
    $("#introexpand").css("height", "auto").show();
    var pHeight = $("#introexpand p:first").height() + 15;
    $("#introexpand").css("height", pHeight);
}

因此，在重置高度之前将pHeight设置为自动并显示一小段时间，以便获得正确的高度。

问题是，当我调整浏览器大小时，＃introexpand div会在单击链接span.learnmore之前弹出。

如果我从CSS中删除高度auto，它似乎可以修复它，但是点击时会显示#introexpand div dosent函数。

Answer 1

你可以让这个函数在onresize-handler（jQuery）中运行，但用CSS解决它更简单：

#introexpand {
    padding-bottom: 15px;
}

Answer 2

为什么不采用不同的方法。不要试图计算#introexpand所需的高度，而是让它始终是自动的，只需在点击display:none;时切换span.learnmore。

为此，您需要从position:relative移除#introexpand，从position:absolute移除#introexpand p。

完成后，只需将#introexpand默认为display:none，然后click span.learnmore .show() div {{1}} {{1}}或者.slideToggle()它是一个有点发烧友的东西。

我只是觉得你试图让它变得比它需要的更复杂。

高度自动 - 在调整浏览器大小时显示隐藏的内容

2 个答案: