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轉換不起作用。這是一個錯誤？

回答

相關問題