使用 jQuery SlideToggle 扩展 Div

Question

任何人都可以为我阐明这一点：

http://67.212.188.229/fcf/index.html< /a> <- 请查看右侧面板，我希望用户单击其中一个面板并让框随其内容展开。我有点击和内容，但出于某种原因我无法让 div 随内容扩展。

任何帮助都会受到极大的欢迎。

问候，

毫米

Answer 1

您的

具有这种风格：

.fcfSamplePack {
    position: absolute;
    width: 247px;
    margin: 10px;
    display:none;
    margin-top: 10px;
}

您需要删除该 position:absolute;，然后它将按预期工作，目前它在正常流程中不占用任何空间，这意味着它所在的

不会扩展以容纳它。只需删除此样式即可解决问题:)

Answer 2

我在 chrome 中看到的是，您的 div 正在工作，但文本框比 div 宽。而且 div 没有背景颜色，所以我可以看到它下面的内容。我尝试使用以下 div 样式，它看起来更好一点 background-color:white;边框：1px 红色实心；内边距：10px；。文本框变宽的原因是应用在其上的样式具有 2px 的填充，除了 100% 的宽度之外，还增加了 4px 的宽度。此外，应用于输入的任何边框都会添加到宽度中。这样文本框就会变得更宽。因此，另一个选择是将文本框的宽度设置为 90%。

我还注意到，当我单击输入时，div 会隐藏。此外，当我单击第二个按钮一次并单击第一个按钮时，两个 div 都是可见的。