使用“幻灯片”效果显示/隐藏<input />

Question

考虑以下JSFiddle，它使用jQuery的slideToggle（即slideUp或slideDown）来显示/隐藏输入元素：

http://jsfiddle.net/sfN9C/

顶部输入在向上和向下滑动时看起来很不稳定，因为我正在直接滑动元素。

第二个输入看起来更好。

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

jQuery允许。通过JavaScript动态插入额外的div不是首选;希望我能做的更好。

Answer 1

我不认为这是可能的，因为slideToggle实际上激活了元素的高度。在你的第二个例子中（使用包装器div），它是动画的div，输入保持相同的高度，只是出现或重新出现，好像在它前面绘制了一个窗帘。

Answer 2

将输入显示定义为块有助于并且似乎在IE7中有效。留待您决定是否接受可用的用户界面

http://jsfiddle.net/sfN9C/1/