Javascript 使用「；幻灯片“；显示/隐藏图像的效果<；输入>；

考虑以下JSFIDLE，它使用jQuery的

slideToggle

（即

slideUp

或

slideDown

）来显示/隐藏输入元素：

上下滑动时，顶部输入看起来不稳定，因为我直接滑动元素

第二个输入看起来更好

我可以得到第二个效果，但没有额外的div吗

---

jQuery是允许的。不推荐通过JavaScript动态插入额外的div；希望我能做些更好的事情。

我认为这是不可能的，因为

slideToggle

实际上为元素的高度设置了动画。在第二个示例（使用包装器div）中，设置动画的是div，输入保持相同的高度，只是显示或重新出现，就好像在它前面画了一个窗帘。

将输入显示定义为块有助于在IE7中工作。让您自己决定是否接受UI

---

如果尚未将其包装到父元素（div或类似元素）中，则需要将其包装到父元素中。否则你可以这样做：

$（'input'）.parent（）.slideToggle（）$（'input'）.wrap（''.parent（）.slideToggle（）@kernel，它会破坏任何以兄弟或子组合符作为输入目标的css。是的，我意识到这就是正在发生的事情；这就是我问这个问题的全部意义。很好！真不敢相信我没有想到。Chrome 17中仍然有点跳跃。@在我的Chrome 17内核中，它没有像原来那样“跳跃”，但它也会动画化边距，因此输入向上移动（但平稳）。这实际上是需要的，因为当一切都完成时，它不需要留下任何自己的痕迹。