使用 CSS3 旋转时无法淡出答案

【问题标题】：Can't fadeout when using CSS3 rotate使用 CSS3 旋转时无法淡出
【发布时间】：2013-01-13 14:12:55
【问题描述】：

我在使用 Google Chrome 时遇到了一个相当奇怪的问题。应用 CSS3 变换（旋转）后，我无法淡出 H1 元素。这似乎是一个奇怪的问题，除了使用图像之外我无法解决。有没有人知道解决这个问题的方法，如果我不需要，我不想用图像破解这个问题。

这是特定 H1 的 CSS

.studieprogramLinje h1{
color:#fff;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
 transform: rotate(90deg);
 white-space: nowrap;
 margin-top:270px;
 font-weight: 100;
 }

而 JQuery 部分只是：

$('#mobilApputvikling h1').fadeOut(200);

如果我像这样淡出所有 h1 元素，它似乎可以工作：

$('h1').fadeOut(200);

但不是这个特定的。但是，如果我删除 CSS3 中的旋转，它会起作用..

【问题讨论】：

你应该提供一个测试链接或者更好的 jsfiddle
我试过了，但旋转似乎在 JSFiddle 中不起作用。
Rotate (CSS3) 应该在 jsfiddle 上工作

标签： jquery html css rotation transform

【解决方案1】：

您是否尝试过使用 jQuery animate 来代替？可能会产生相同的效果，但可能是一种解决方法。

$('h1').animate({ opacity: 0 }, 200);

如果没有解决方法，提交错误如何：Chromium Bugs

【讨论】：

是的，我也试过了。忘了提 - 无论哪种方式它仍然不起作用。什么都没有发生。
我想过，也许我应该。多么奇怪的问题！ Safari 似乎是一样的，所以它可能是一个 webkit 问题。我会深入研究它，现在用图像破解它！谢谢你的回答！