jquery - 动态div高度

Question

我有这个HTML代码：

<div id="container">
    <div id="feedbackBox"></div>   
</div>

#feedbackBox div最初没有出现。

CSS是为了集中div：

#container {
    position: absolute; width: 380px; height: 360px; left: 50%; top:50%; padding: 30px;
    margin-left: -220px; margin-top: -210px; 
}

但我需要通过 jQuery更改#feedbackboxheight的。

我测试了它，它不起作用：

.expandInfo {
    height: 500px;
    margin-top: -221px;
}

$("#container").removeClass().addClass('expandInfo');

但它不起作用！CSS 类不适用，更不用说重新完成（计算）以使 div 保持集中。

score 1 · Accepted Answer

您通过 ID设置#container 的高度。.expandInfo的高度由 class定义。但是在 CSS 中，ID 选择器的优先级高于类选择器。

试试看：

#container.expandInfo {
    height: 500px;
    margin-top: -221px;
}

此选择器具有 ID 优先级和类优先级。它将覆盖的高度#container

score 0 · Accepted Answer

我已经看到您在 css 中使用#container，然后删除类。由于容器没有任何类是没有意义的。

查看示例容器有一个类容器，然后单击您可以显示该框并应用您想要的类。

2 回答 2