css-transitions - webkit 转换似乎在某些 box-shadow 规则中不起作用

Question

我想要一个表格单元格中的可扩展树。我得到了它的工作。在玩弄它时，我尝试添加一个过渡的盒子阴影。这仅在根级别有效。（JsFiddle）。

该问题可能与在 display (link)上不起作用的转换有关。但是显示更改是否会破坏所有转换，或者我错过了什么？（我只加入了一个 webkit 转换。）

谢谢。

Answer 1

编辑：这可能是一种可能的解决方法，因为过渡效果不起作用。

您是否尝试过使用关键帧动画？我对代码做了一些更改。这是一个演示（jsFiddle）。

我变了：

/* This transition seems to have no effect. */
    -webkit-transition: box-shadow 0.5s;
}  

到：

/* This transition seems to have no effect. */
    -webkit-animation: shadow 0.5s ease-in-out;
}  

@-webkit-keyframes shadow {
    0%   { box-shadow: 0px 0px 0px #000; }    
    100% { box-shadow: 4px 4px 7px #000; }
}