是否有针对 Opera 可见性转换错误的 CSS 解决方法？

Question

这是一个开始的小提琴： http://jsfiddle.net/kizu/A7QX9/

问题：在 Opera 中，当您为 visibility 属性（通常与 opacity 一起）设置过渡动画时，它的动画效果不正确：visibility 始终更改为过渡结束，因此当块出现时，它不会顺利出现。

那么，问题是：是否有任何仅 CSS 的解决方法来解决这个 Opera 的错误？

Answer 1

在我提出问题并思考一段时间后，我自己找到了答案。

并想出了一个解决方案。

因此，逐步进行：

1. 让我们看一下需要显示开始时隐藏的块的情况。
2. 当您使用过渡切换不透明度和可见性时，当过渡处于运行状态时，块将保持visibility:hidden状态。因此，您不需要在此处使用过渡来实现可见性。
3. 但是，当您再次隐藏该块时，您需要在转换结束时切换可见性，因此显然需要在此处进行转换。
4. 因此，在隐藏块的选择器中，您必须具有不透明度的过渡，而在显示块的选择器中，则不需要过渡。

这是我用这个解决方案制作的小提琴： http://jsfiddle.net/kizu/A7QX9/ 1/

Answer 2

Opera 中当前过渡的实现基于旧版规范，该版本规定转换可见性“1 是“可见”，所有其他值都是“隐藏”。”

因此，如果您尝试从“隐藏”转换为“可见”，那么您将看不到该元素，直到表示转换的底层 0-1 范围达到值 1。
同时，如果您从“可见”过渡到“隐藏”，则一旦开始过渡，元素就会消失，因为值将小于 1。

您期望的行为在规范的“草案”版本中指定，其中表示“0 是“隐藏的”，所有其他值都是“可见的”。”

不过好消息是 - Opera 12 将修复此错误。预计很快就会在 Desktop Team 博客 上看到带有修复程序的测试版本。