Firefox转换不起作用。这是一个错误？

我有一个简单的图像交换过渡，只适用于铬。验证码：Firefox转换不起作用。这是一个错误？

<a class="twitter" href="index.php"></a> 

.twitter { 
    width:26px; 
    height:26px; 
    display:block; 
    background:transparent url('../images/twitter.jpg') center top no-repeat; 
    -webkit-transition: all 0.3s linear; 
    -moz-transition: all 0.3s linear; 
    -o-transition: all 0.3s linear; 
    transition: all 0.3s linear; 
    } 

.twitter:hover {background-image: url('../images/twitter-hover.jpg');}

演示：http://jsfiddle.net/gWKEQ/17/

来源

2013-02-15 devotchkah

你试图重现什么样的背景图像转换？演示它的小提琴会加快速度。 – 2013-02-15 13:10:19

放置'转换：全部为0.3s线性;'高于所有其他浏览器特定的转换并再试一次。 – Antony 2013-02-15 13:21:31

它没有工作。这里是例子http://jsfiddle.net/gWKEQ/17/ – devotchkah 2013-02-15 13:33:07

这是因为只有Chrome浏览器实际上支持动画的background-image CSS属性 - 这是根据the spec，在那里的标注为实际上是不正确：

背景-image

动画：否

欲了解更多有关什么可以动画的信息（也在哪些浏览器等），检查出this page。未来，其他浏览器将有望允许动画background-image属性（并且规范将改变），因为这是程序员/设计师实际需要的东西。

来源

2013-02-15 13:49:09 MarcoK

Firefox转换不起作用。这是一个错误？

回答

相关问题