Javascript CSS3转换淡出显示属性

我曾试图使用css3进行淡出转换，但发现display不适用于转换

我有一个组对象

，它有

标题和

，我有一个onclick事件绑定到

，它应该使组类消失。我已经尝试用

{opacity:0；height:0；overflow:hidden；}

来解决显示问题，这很好，因为它与

{display:none}

具有相同的效果，但是

CSS

JS

它在关闭时不做任何动画，但在重新出现时淡出。它只是瞬间消失

是的，我需要CSS3。不，我不能使用jQuery

有什么想法吗

谢谢

不要试着去做。这行不通

---

您可以使用JavaScript计算元素的像素高度，并在

block.setStyle（）

调用中使用该高度。

您正在使用哪个浏览器进行测试..您可以创建一个小提琴并向我们展示。。

transition: all 2s ;
-webkit-transition: height 2s ease-out;
transition: opacity 2s ease-out ;
display: block;
-webkit-transition: opacity 2s ease-out;

//collapse function
block.setStyle({opacity: 0});
block.setStyle({height: 0});

//expand function
block.setStyle({opacity: 1});
block.setStyle({height: 'auto'});